-本日のアジェンダ-
1限目
学科 HTML/CSS基礎⑦
CSSのプロパティについて
2限目
学科 HTML/CSS基礎⑦
CSSのプロパティについて
3限目
学科 HTML/CSS基礎⑦
CSSのプロパティと値を考える
4限目
学科 HTML/CSS基礎⑦
Webページ制作実践
5限目
学科 HTML/CSS基礎⑦
Webページ制作実践
【講師用カリキュラム情報】
※このブロックは公開時は非表示になります。削除しないでください。
※講師用の情報（注記）を追記して頂いても大丈夫です。
ストーリー：とにかくグラフィックソフトを使うHTMLとCSSの理解
内容1：HTMLとCSSについて
内容2：HTMLとCSSについて
内容3：
課題：なし
【注記】
・新カリキュラム用に修正（2024/8/14：大浜）
本日のテーマ
レイアウト系プロパティを理解しましょう
CSS：レイアウト系プロパティ
- position/top/left/bottom/right プロパティ（要素の配置方法）
- z-index プロパティ（重なりの順序方法）
CSS：ボーダー系プロパティ
- border-style プロパティ（ボーダースタイル）
- border-color プロパティ（ボーダー色）
- border-width プロパティ（ボーダー幅）
- border プロパティ（ボーダー一括指定）
- border-top/-bottom/-left/-right プロパティ（ボーダー上下左右一括指定）
CSS：その他のプロパティ
- border-radius プロパティ（ボーダーの丸み）
- box-shadow プロパティ（ボックスの影）
- box-sizing プロパティ（ボックスサイズ計算）
- content プロパティ（挿入コンテンツ）
- object-fit プロパティ（画像トリミング）
- object-position プロパティ（画像の配置位置指定）
CSS：擬似クラス系セレクタ
- link 擬似クラス（未訪問リンクスタイル）
- visited 擬似クラス（訪問済リンクスタイル）
- hover 擬似クラス（オンカーソルスタイル）
- active 擬似クラス（アクティブスタイル）
- first-child/last-child 擬似クラス（先頭・最終の子要素指定）
- nth-child 擬似クラス（n 番目の子要素指定）
- nth-of-type 擬似クラス（同一のセレクタを持つ n 番目の子要素指定）
- not 擬似クラス（指定値以外の要素指定）
CSS：擬似要素系セレクタ
- first-letter 擬似要素（要素の 1 文字目を指定）
- first-line 擬似要素（要素の 1 行目を指定）
- before/after 擬似要素（要素の直前・直後にコンテンツの挿入）
本日の課題
本日学んだ内容を復習して整理しておきましょう。
WordPressの投稿ページに学んだことをまとめておくと良いです。