>> HTMLトップに戻る
～文字関連～
～背景関連～
～ボーダー関連～
～リスト関連～
～位置、幅、横線、余白関連～
～イベント・カーソル関連～
～セレクタ関連～
>> HTMLトップに戻る
CSSリファレンス一覧
| 属性名 | 説明 |
|---|---|
| color | 文字色の設定 |
| font | テキストの色、サイズ等を一括で指定する |
| font-style | 文字をスタイルをイタリック体・斜体かを設定できる |
| font-weight | 文字の太さの設定を行う |
| font-size | 文字サイズの設定を行う |
| font-family | フォントの設定を行う |
| font-stretch | 文字を縦長・横長の設定を行う |
| line-height | 行の高さの設定を行う |
| letter-spacing | 文字間隔の設定を行う |
| text-align | ブロック内の文字の横方向の位置の設定する |
| vertical-align | ブロック要素内の縦方向の表示位置の設定を行う |
| text-decoration | 文字の下線や打消し戦などの設定を行う |
| text-indent | 文章内の一行目の余白の設定を行う |
| text-transform | 大文字小文字表示の設定を行う |
| text-shadow | 文字に影をつける |
| white-space | 文字表示の設定を行う |
| word-spacing | 単語間隔の設定を行う |
～背景関連～
| 属性名 | 説明 |
|---|---|
| background | 背景関連の設定を一括で行う。 |
| background-color | 背景色の設定を行う |
| background-image | 背景画像の設定を行う |
| background-repeat | 背景画像のリピートの設定を行う |
| background-attachment | 背景画像の固定・位置の設定をまとめて行う。 |
| background-position | 背景画像の表示開始位置の設定を行う |
| background-position-x | 背景画像の横位置の設定を行う（IEのみ） |
| background-position-y | 背景画像の縦位置の設定を行う（IEのみ） |
| 属性名 | 説明 |
|---|---|
| border | 枠線の設定をまとめて行う |
| border-color | 枠線の色の設定を行う |
| border-style | 枠線スタイルの設定を行う |
| border-width | 枠線の太さの設定を行う |
| border-top | 上枠線スタイル・太さ・色の設定を行う |
| border-top-color | 上枠線の色の設定を行う |
| border-top-style | 上枠線のスタイルの設定を行う |
| border-top-width | 上枠線の太さの設定を行う |
| border-bottom | 下枠線の設定をまとめて行う |
| border-bottom-color | 下枠線の色の設定を行う |
| border-bottom-style | 下枠線のスタイルの設定を行う |
| border-bottom-width | 下枠線の太さの設定を行う |
| border-left | 左枠線の設定をまとめて行う |
| border-left-color | 左枠線の色の設定を行う |
| border-left-style | 左枠線のスタイルの設定を行う |
| border-left-width | 左枠線の太さの設定を行う |
| border-right | 右枠線の設定をまとめて行う |
| border-right-color | 右枠線の色の設定を行う |
| border-right-style | 右枠線のスタイルの設定を行う |
| border-right-width | 右枠線の太さの設定を行う |
| empty-cells | 空白セルの枠線の表示・非表示の設定を行う |
| 属性名 | 説明 |
|---|---|
| list-style | リスト関連の設定をまとめて行う |
| list-style-image | リストマーカー用画像の設定を行う |
| list-style-type | リストマーカー文字の設定を行う |
| list-style-position | リストマーカーの表示位置の設定を行う |
| content | 画像、文字等のコンテンツの挿入を行う |
| quotes | 引用符の設定を行う |
| 属性名 | 説明 |
|---|---|
| width | 横幅の設定を行う |
| max-width | 横幅の最大値の設定を行う |
| min-width | 横幅の最小値の設定を行う |
| height | 高さの設定を行う |
| max-height | 高さの最大値の設定を行う |
| min-height | 高さの最小値の設定を行う |
| margin | 余白に関連の設定をまとめて行う |
| margin-top | 上余白の設定を行う |
| margin-bottom | 下余白の設定を行う |
| margin-left | 左余白の設定を行う |
| margin-right | 右余白の設定を行う |
| padding | パディングに関連の設定をまとめて行う |
| padding-top | 上パディングの設定を行う |
| padding-bottom | 下パディングの設定を行う |
| padding-left | 左パディングの設定を行う |
| padding-right | 右パディングの設定を行う |
| position | ボックスの配置方法の設定を行う |
| top | 上からの距離の設定を行う |
| bottom | 下からの距離の設定を行う |
| left | 左からの距離の設定を行う |
| right | 右からの距離の設定を行う |
| display | 要素の表示方法の設定を行う |
| float | 要素の回り込み設定を行う |
| clear | 回り込みの解除を行う |
| z-index | 重なった要素の表示順序の設定を行う |
| visibility | 表示・非表示の設定を行う |
| clip | ボックスのクリッピングを行う |
| overflow | 枠外にはみ出た内容表示設定を行う |
| overflow-x | 枠外にはみ出た内容の表示設定を行う（IE） |
| overflow-y | 枠外にはみ出た内容の表示設定を行う（IE） |
| 属性名 | 説明 |
|---|---|
| :link | 未訪問のリンクの設定を行う |
| :visited | 訪問済のリンクの設定を行う |
| :hover | カーソルを乗せたときの設定を行う |
| :active | アクティブになった時の設定を行う |
| :focus | フォーカスを取得した時の設定を行う |
| cursor | カーソルの形状の設定を行う |
| 属性名 | 説明 |
|---|---|
| *{} | 全ての要素にスタイルを設定 |
| 要素名{} | 特定の要素全てにスタイルを設定 |
| .クラス名{} | 特定のclass名が設定された要素全てにスタイルを設定 |
| #ID名{} | 特定のid名が設定された要素にスタイルを設定 |
| 要素名:first-child | 指定要素の最初の子要素にスタイルを設定 |
| 要素名:first-line | 指定要素の最初の行のみスタイルを設定 |
| 要素名:first-letter | 指定要素の最初の文字のスタイルを設定 |
| 要素名:before | 指定要素の直前にコンテンツを挿入 |
| 要素名:after | 指定要素の直後にコンテンツを挿入 |
| 要素名[属性名]{} | 特定の属性を持つ要素にスタイルを設定 |
| 要素名[属性名="値"]{} | 特定の値を持つ要素にスタイルを設定 |
| 要素名,要素名,要素名・・・ | 複数の要素にまとめてスタイルを設定 |
| 要素名 要素名 | 以下の階層全ての該当要素にスタイルを設定 |
| 要素名 > 要素名 | 直下の子要素のスタイルを設定 |
| 要素名 + 要素名 | 直後の要素のスタイルを設定 |
>> HTMLトップに戻る
