言語
CSS クイックリファレンス
CSS クイックリファレンス の印刷用チートシート。すばやい参照、学習、机上利用向けに整理されています
サンプル
このチートシートの内容
- セレクター
- ボックスモデル
- Flexbox
- Grid
- タイポグラフィ
- 色と背景
- トランジションとアニメーション
- レスポンシブデザイン
- ポジショニング
- カスタムプロパティ
基本セレクター
* | ユニバーサル — すべての要素 |
div | タイプ — すべての `<div>` 要素 |
.class | クラス — クラスを持つ要素 |
#id | ID — id を持つ要素 |
[attr] | 属性 — 属性を持つ要素 |
[attr="val"] | 属性が値と一致 |
コンビネーター
A B | 子孫(任意の深さ) |
A > B | 直接の子のみ |
A + B | 隣接する兄弟(次の要素) |
A ~ B | 一般的な兄弟(以降すべて) |
疑似クラス
:hover | マウスオーバー中の要素 |
:focus | フォーカスがある要素 |
:first-child | 親の最初の子 |
:nth-child(n) | N 番目の子(1始まり、`odd`、`even`、`2n+1`) |
:not(sel) | 否定 — 一致を除外 |
:has(sel) | 親セレクター(一致を含む) |
すべてのセクションを含む印刷用チートシートをダウンロード
PDF をダウンロードダウンロード