・CSS：レイアウト系プロパティ
position/top/left/bottom/right プロパティ
- 要素の配置方法と位置を指定します
- positionで配置方法を決定し、top, bottom, left, rightで具体的な位置を調整します
z-index プロパティ
- 要素の重なり順序を指定します
- 数値が大きいほど前面に表示されます。positionプロパティがstatic以外の場合に有効です
・CSS：ボーダー系プロパティ
border-style プロパティ
- ボーダーのスタイルを指定します
border-color プロパティ
- ボーダーの色を指定します。transparentで透明にできます
border-width プロパティ
- ボーダーの幅を指定します。複数指定で各辺の幅を個別に設定可能です
border プロパティ
- ボーダーのスタイル、色、幅をまとめて指定するショートハンドです
border-top/-bottom/-left/-right プロパティ
- 各辺のボーダーを個別に指定するショートハンドです
- それぞれのプロパティに「-style」、「-color」、「-width」を付与することで個別に指定することも可能です
・CSS：その他のプロパティ
border-radius プロパティ
- ボックスの角を丸くします。各角の丸みを個別に指定可能です
box-shadow プロパティ
ボックスに影をつけます。影の位置、ぼかし、広がり、色などを指定できます
box-sizing プロパティ
- ボックスのサイズ計算方法を指定します。content-boxとborder-boxがあります
content プロパティ
- 「::before」疑似要素や「::after」疑似要素と共に使用され、要素の直前または直後にコンテンツを挿入します
object-fit プロパティ
- img タグや video タグのコンテンツのはめ込み方法を指定します
object-position プロパティ
- iframe タグ、img タグ、video タグのコンテンツの配置位置を指定します
・CSS：擬似クラス系セレクタ
link/visited 擬似クラス
リンクの未訪問状態と訪問済状態にスタイルを適用します
hover 擬似クラス
要素にカーソルが乗った時のスタイルを適用します
active 擬似クラス
要素がアクティブ（クリック中など）な時のスタイルを適用します
first-child/last-child 擬似クラス
最初と最後の子要素にスタイルを適用します
nth-child 擬似クラス
n番目の子要素にスタイルを適用します
nth-of-type 擬似クラス
同一のセレクタを持つn番目の子要素にスタイルを適用します
not 擬似クラス
指定した要素以外の要素にスタイルを適用します
・CSS：擬似要素系セレクタ
first-letter 擬似要素
要素の最初の文字にスタイルを適用します
first-line 擬似要素
要素の最初の行にスタイルを適用します
before/after 擬似要素
要素の直前または直後にコンテンツを挿入します。contentプロパティと組み合わせて使用します
今後
セレクタ、疑似要素。実際に打ち込み、表示しないと分からないので難しいと思えてきました。
時間がある時に見直しをします
コメント