|
||||||
|
STYLESEET一覧 ( *.html ) <head><style type="text/css"><!-- (要素).(クラス) { スタイル; } --></style></head> ( *.html ) <head><link rel="stylesheet" href="**.css" type="text/css"></head> ( **.css ) (要素).(クラス) { スタイル; } ( *.html ) <要素 style="スタイル"> <要素 class="クラス"> |
||||||
| スタイル | 補則 | 説明 |
| color: 色; | 文字色 | |
| background: url("URL") 色 位置 並び方 固定; background: url('URL') 色 位置 並び方 固定; | 背景画像まとめて指定 | |
| background-color: 色; | 背景色 | |
| background-image: url("URL"); background-image: url('URL'); | 背景画像 | |
| background-repeat: 並び方; | 並び方 repeat repeat-x repeat-y no-repeat | 背景画像並び方 |
| background-position: 位置; background-position: 横位置 縦位置; | 位置 数% 数px ・・ left right center top bottom | 背景画像表示位置 |
| background-attachment: 固定; | 固定 fixed scroll | 背景画像固定 |
| font: イ ロ ハ ニ ホ; | イ font-style ロ font-variant ハ font-weight ニ font-size 省略不 ホ font-family 省略不 | フォントまとめて指定 |
| font-style: スタイル; | スタイル normal italic oblique | フォントスタイル |
| font-variant: 指定; | 指定 normal small-caps | フォントスモールキャップ |
| font-weight: 太さ; | 太さ normal bold lighter bolder 100、200〜900 | フォントの太さ |
| font-size: サイズ; | サイズ smaller larger xx-small x-small small medium large x-large xx-large 数% 数px ・・ | フォントサイズ |
| font-family: フォント1,2,・・; | フォント serif sans-serif cursive fantasy monospace ＭＳ Ｐゴシック ＭＳ 明朝 | フォント種類 |
| line-height: 高さ; | 高さ normal 数% 数px ・・ | 行の高さ |
| text-align: 位置; | 位置 left right center justify | 行揃え |
| vertical-align: 位置; | 位置 top middle bottom baseline text-top text-bottom super sub 数% 数px ・・ | 縦方向の位置関係 |
| text-decoration: 装飾; | 装飾 none underline overline line-through blink | テキスト装飾 |
| text-indent: 幅; | 幅 数% 数px ・・ | 一行目インデント幅 |
| text-transform: フォーム; | フォーム none capitalize lowercase uppercase | テキスト大文字、小文字表示を指定 |
| white-space: 表示方法; | 表示方法 normal pre nowrap | ソース中のスペース、タブ、改行の表示方法 |
| letter-spacing: 間隔; word-spacing: 間隔; | 間隔 normal 数px ・・ | 文字間隔 単語間隔 |
| width: 幅; height: 高さ; | 幅高さ auto 数% 数px ・・ | 幅 高さ |
| max-width: 幅; max-height: 高さ; | 幅高さ none 数% 数px ・・ | 幅の最大値 高さの最大値 |
| min-width: 幅; min-height: 高さ; | 幅高さ 数% 数px ・・ | 幅の最小値 高さの最小値 |
| margin: 上下左右; margin: 上下 左右; margin: 上 左右 下; margin: 上 右 下 左; margin-left: 左マージン; margin-right: 右マージン; margin-top: 上マージン; margin-bottom: 下マージン; | マージン 数% 数px ・・ 例 margin: 10px 30px 50px 70px; margin: 10px 30px 50px; margin-right: 10px; | マージン |
| padding: 上下左右; padding: 上下 左右; padding: 上 左右 下; padding: 上 右 下 左; padding-left: 左パディング; padding-right: 右パディング; padding-top: 上パディング; padding-bottom: 下パディング; | パディング 数% 数px ・・ 例 padding: 10px 30px 50px 70px; padding: 10px 30px 50px; padding-right: 10px; | 枠と内容の間の空間 |
| border: スタイル 太さ 色; border-right: スタイル 太さ 色; border-left: スタイル 太さ 色; border-top: スタイル 太さ 色; border-bottom: スタイル 太さ 色; | 枠をまとめて指定 | |
| border-style: 上下左右; border-style: 上下 左右; border-style: 上 左右 下; border-style: 上 右 下 左; border-left-style: 左スタイル; border-right-style: 右スタイル; border-top-style: 上スタイル; border-bottom-style: 下スタイル; | スタイル none hidden dotted dashed solid double groove ridge inset outset | 枠の形式 |
| border-width: 上下左右; ・・・省略 border-left-width: 太さ; border-right-width: 太さ; border-top-width: 太さ; border-bottom-width: 太さ; | 太さ thin medium thick 数px ・・ | 枠の太さ |
| border-color: 上下左右; ・・・省略 border-left-color: 色; border-right-color: 色; border-top-color: 色; border-bottom-color: 色; | 色 色 transparent | 枠の色 |
| overflow: 表示方法; | 表示方法 visible scroll hidden auto | 範囲内のはみ出た内容の表示 |
| position: 配置方法; | 配置方法 static relative absolute fixed | 範囲内の配置方法 |
| top: 上位置; bottom: 下位置; left: 左位置; right: 右位置; | 位置 auto 数% 数px ・・ | 配置位置 |
| display: 表示形式; | 表示形式 none inline block marker list-item compact run-in table inline-table table-caption table-row table-cell table-column table-row-group table-column-group table-header-group table-footer-group | 要素の表示形式 |
| float: 位置; | 位置 left right none | 左右へ配置と回り込み |
| clear: 解除方向; | 解除方向 left right none both | 回り込み解除 |
| z-index: 順序; | 順序 auto 整数値（数字が大が上になる） | 重なり順序を指定 |
| visibility: 表示; | 表示 visible hidden collapse | 範囲内の表示・非表示 |
| clip: 範囲; | 範囲 auto rect(上 右 下 左) | 範囲内を切り抜き表示 |
| direction: 方向; | 方向 ltr rtl | 文字表記の方向 |
| unicode-bidi: 方向; | 方向 normal embed bidi-override | Unicodeの文字表記の方向 |
| writing-mode: 方向; | 方向 tb-rl lr-tb | 縦書き文字 |
| table-layout: 表示方法; | 表示方法 auto fixed | テーブルの表示方法 |
| caption-side: 位置; | 位置 top bottom left right | テーブルのキャプションの位置 |
| border-collapse: 表示; | 表示 collapse separate | セルのボーダーの表示 |
| border-spacing: 間隔; | 間隔 数px ・・ | セルのボーダーの間隔 |
| empty-cells: 表示; | 表示 show hide | 空白セルのボーダーの表示・非表示 |
| list-style: 形式 url("URL") 位置; list-style: 形式 url('URL') 位置; | リストのマークまとめて指定 | |
| list-style-type: 形式; | 形式 disc circle square decimal lower-roman upper-roman lower-alpha upper-alpha none | リストのマーク番号形式 |
| list-style-image: url("URL"); list-style-image: url('URL'); | リストのマーク画像形式 | |
| list-style-position: 位置; | 位置 outside inside | リストのマーク表示位置 |
| cursor: 形状; | 形状 auto crosshair default pointer move text wait help n-resize s-resize w-resize e-resize ne-resize nw-resize se-resize sw-resize all-scroll not-allowed progress | カーソルの形状 |
|
|