よく使うCSSの用途と、書式、値の設定をわかりやすく表にまとめました。
| 属性 | 説明 | 書式 | 値 | |
| キーワード | 数値/単位 | |||
| background- attachment | 背景画像のスクロールをしていする | background-attachment : キーワード | fixed,scroll | |
| background- color | 要素の背景色を指定する | background-color : キーワード | transoarent,#rrggbb,#rgb カラーネーム,rgb(r,g,b), rgb(r%,g%,b%),rgba(r,g,b,a) | |
| background- image | 要素の背景画像を指定する | background-image : url(画像ファイルのパス) | none,画像ファイルのURL | |
| background- position | 背景画像の表示位置を指定する | background-position : 左右方向,、上下方向の順に 半角スペースで区切る | left,right,center,top,bottom | px,%, em,vwなど |
| background- repeat | 背景画像の繰り返しパターンを指定する | background-repeat : キーワード | repeat,repert-x,repert-y, no-repeat | |
| background- size | 背景画像の大きさを指定する | background-size : キーワードまたは数値と単位 | auto,cover,cotain | px,%, em,vwなど |
| border | border-width / style / color の３つ プロパティをまとめて指定する | border : 各プロパティの値を 半角スペースで区切る | 個別のプロパティ値 | |
| border- collapse | 隣り合うセルのボーダーを結合する か分離するかを指定する | border-collapse : キーワード | collapse,separate | |
| border-color | ボックスの境界線の色を指定する | border-color : キーワード | transoarent,#rrggbb,#rgb カラーネーム,rgb(r,g,b), rgb(r%,g%,b%),rgba(r,g,b,a) | |
| border-radius | ボーダーの角を丸める | border-radius : 数値と単位 | px,%, em,vwなど | |
| border-spacing | 隣り合うセルのボーダー同士の 距離を指定する | border-spacing : 数値と単位 | px,%, em,vwなど | |
| border-style | ボックスの境界線のスタイルを 指定する | border-style : キーワード | none,hidden,dotted,dashed,solid, double,groove,ridge,inset,outset | |
| border-width | ボックスの境界線の幅を指定する | border-width : キーワードまたは数値と単位 | thin,medium,thick | px,%, em,vwなど |
| color | 文字色を指定する | color : 色の値 | #rrggbb,#rgb,カラーネーム, rgb(r,g,b),rgba(r,g,b,a), rgb(r%,g%,b%) | |
| content | : before 擬似要素、: after 擬似要素 前後に、仮想的に文字列や画像を 生成する | content : 値(文字列の場合は 「’」または「”」で囲む） | 文字列,URL, カウンタ,attr(X), open-quote,close-quote, no-open-quote,no-close- quote | |
| cursor | ポインタ（カーソル）の形状を 指定する | cursor : キーワード | auto,crosshair,default, pointer,move,e-resize, ne-resize,nw-resize, n-resize,se-resize, sw-resize,s-resize, w-resize,text,wait, progress,help,URL | |
| display | ボックスの表示形式を指定する | display : キーワード | none,block,inline, inline-block,run-in, list-item,table,inline-table, table-row,table-row-group, table-header-group, table-footer-group, table-column, table-column-group, table-cell,table-caption | |
| float | ボックスを左右に寄せて、その 反対側に後続の内容を流し込ませる | float : キーワード | none,left,right | |
| font-family | テキストを表示する際のフォントを 指定する | font-family : キーワード | フォント名,sans-serif, serrif,monospace, fantasy,cursive | |
| font-size | 文字のサイズを指定する | font-size : キーワード または数値と単位 | xx-small,x-small,small, medium,large,x-large, xx-large,lager,smaller | px,%, em,vwなど |
| font-weight | 文字の太さを指定する | font-weight : キーワード | nomal,bold,bolder,lighter | 100-900 |
| height | ボックスの高さを指定する | height : キーワード または数値と単位 | auto | px,%, em,vwなど |
| line-height | 行の高さを指定する | line-height : キーワード または数値と単位 | nomal | 倍数 / ox, %,em,vw,など |
| list-style | list-style-image / position / type の３つのプロパティをまとめて 指定する | list-style : 各プロパティの値 を半角スペースで区切る | none,個別のプロパティの値 | |
| list-style-image | リスト項目の行頭アイコン画像を 指定する | list-style-image : url | none,画像ファイルのURL | |
| list-style- position | リスト項目の行頭アイコンの表示 位置を指定する | list-style-position : キーワード | outside,inside | |
| list-style-type | リスト項目の行頭アイコンの形状を 指定する | list-style-type : キーワード | none,disc,circle,square, decimal,georgian, cjk-ideographicほか多数 | |
| margin | ボックスの外側の余白を指定する | margin : キーワード または数値と単位 | auto | px,%, em,vwなど |
| margin-bottom | ボックスの外側の下部の 余白を指定する | margin-bottom : キーワード または数値と単位 | auto | px,%, em,vwなど |
| margin-left | ボックスの外側の左側の 余白を指定する | margin-left : キーワード または数値と単位 | auto | px,%, em,vwなど |
| margin-light | ボックスの外側の右側の 余白を指定する | margin-light : キーワード または数値と単位 | auto | px,%, em,vwなど |
| margin-top | ボックスの外側の上部の 余白を指定する | margin-top : キーワード または数値と単位 | auto | px,%, em,vwなど |
| max-width | 要素の幅の上限を指定する | max-width : キーワード または数値と単位 | none | px,%, em,vwなど |
| opacity | 要素の不透明度を指定する | opacity : 数値 | 0以上 1以下の数値 | |
| padding | ボックスの外側の余白を指定する | paddubg : 数値と単位 | px,%, em,vwなど | |
| padding-bottom | ボックスの内側の下部の 余白を指定する | paddubg : 数値と単位 | px,%, em,vwなど | |
| padding-left | ボックスの内側の左側の 余白を指定する | paddubg : 数値と単位 | px,%, em,vwなど | |
| padding-right | ボックスの内側の右側の 余白を指定する | paddubg : 数値と単位 | px,%, em,vwなど | |
| padding-top | ボックスの内側の上部の 余白を指定する | paddubg : 数値と単位 | px,%, em,vwなど | |
| text-align | テキストや画像などの水平方向の 揃え方を指定する | text-align : キーワード | left,right,center,justify | |
| text-decoration | テキストに下線、上線、ち消し線 などの装飾を施す | text-decoration : キーワード | none,underline,overlain line-through | |
| vertical-align | テキストや画像などの垂直方向の 位置揃えを指定する | vertical-align :キーワード または数値と単位 | baseline,top,bottom, middle,super,sub,text-top, text-bottom | px,%, em,vwなど |
| width | ボックスの幅を指定する | width : キーワード または数値と単位 | auto | px,%, em,vwなど |