CSSプロパティ一覧

CSSの基本的なルール（文法等）を確認したい場合は、「初心者向け７【CSSの書き方と構造】ホームページをデザインしよう—1-2.「HOME」ページ（index.html）に適用するCSSファイルを記述しよう」をご参照下さい。

CSSプロパティ一覧

＜フォント・テキスト＞

プロパティ	内容
font-style	文字のスタイルを定義します。
font-variant	文字のスモールキャピタルを定義します。（英文字の小文字部分を大文字の縮小形で表示）
font-weight	文字の太さを定義します。
font-size	文字のサイズを定義します。
（line-height）	行の高さを定義します。
font-family	文字の書体を定義します。
font	上記のfont-××群（line-height含む）をまとめて定義できます。
text-align	文字列の水平方向の位置を定義します。
vertical-align	文字列の垂直方向の位置を定義します。
line-height	行の高さを定義します。
text-decoration	文字の装飾を定義します。
text-indent	文字列の1行目の字下げを定義します。
text-transform	文字列（単語）の大文字・小文字を定義します。
letter-spacing	文字の間隔を定義します。（単語間ではなく文字間）
word-spacing	文字列（単語）の間隔を定義します。（英単語が対象）
white-space	スペース（半角・tab）の扱いを定義します。

＜色・背景＞

プロパティ	内容
color	文字の色を定義します。
background-color	背景の色を定義します。
background-image	背景に使用する画像を定義します。
background-repeat	背景に使用する画像の並べ方を定義します。
background-position	背景に使用する画像の位置を定義します。
background-attachment	背景に使用する画像を固定するか定義します。
background	上記のbackground-××群をまとめて定義できます。

＜幅・高さ＞

プロパティ	内容
width	領域の幅を定義します。
height	領域の高さを定義します。
max-width	領域の最大幅を定義します。
min-width	領域の最小幅を定義します。
max-height	領域の最大高を定義します。
min-height	領域の最小高を定義します。

＜表示・配置＞

プロパティ	内容
overflow	領域に対して、どのように表示させるかを定義します。（領域からはみ出した部分を、どのように扱うか定義）
display	領域に対して、どのように表示させるかを定義します。（インライン表示・ブロックレベル表示）
visibility	領域を確保した状態で、表示と非表示を定義します。
clip	切り抜きを定義します。（画像などで切り抜くか定義。切り抜く場合は領域を定義）
float	配置方法を定義します。（ボックスを左に配置し、テキストなどを右側に回り込ませる等）
clear	上記floatの解除を定義します。
position	ボックスの配置方法を定義します。（top・right・bottom・leftプロパティで位置を定義）
top	ボックスの位置を定義します。（上からの距離。positionを定義している場合に有効）
right	ボックスの位置を定義します。（右からの距離。positionを定義している場合に有効）
bottom	ボックスの位置を定義します。（下からの距離。positionを定義している場合に有効）
left	ボックスの位置を定義します。（左からの距離。positionを定義している場合に有効）
z-index	ボックスの重なりの順番を定義します。（positionを定義している場合に有効）

＜外側余白（マージン）＞

プロパティ	内容
margin-top	外側余白（上）を定義します。
margin-right	外側余白（右）を定義します。
margin-bottom	外側余白（下）を定義します。
margin-left	外側余白（左）を定義します。
margin	上記のmargin-××群をまとめて定義できます。

＜内側余白（パディング）＞

padding-top	内側余白（上）を定義します。
padding-right	内側余白（右）を定義します。
padding-bottom	内側余白（下）を定義します。
padding-left	内側余白（左）を定義します。
padding	上記のpadding-××群をまとめて定義できます。

＜境界線＞

プロパティ	内容
border-top-width	境界線（上）の太さを定義します。
border-right-width	境界線（右）の太さを定義します。
border-bottom-width	境界線（下）の太さを定義します。
border-left-width	境界線（左）の太さを定義します。
border-width	上記のborder-××-width群をまとめて定義できます。
border-top-color	境界線（上）の色を定義します。
border-right-color	境界線（右）の色を定義します。
border-bottom-color	境界線（下）の色を定義します。
border-left-color	境界線（左）の色を定義します。
border-color	上記のborder-××-color群をまとめて定義できます。
border-top-style	境界線（上）のスタイル（線種）を定義します。
border-right-style	境界線（右）のスタイル（線種）を定義します。
border-bottom-style	境界線（下）のスタイル（線種）を定義します。
border-left-style	境界線（左）のスタイル（線種）を定義します。
border-style	上記のborder-××-style群をまとめて定義できます。
border-top	境界線（上）の太さ・色・スタイル（線種）を定義します。上記のborder-top-(width・color・style)群をまとめて定義できます。
border-right	境界線（右）の太さ・色・スタイル（線種）を定義します。上記のborder-right-(width・color・style)群をまとめて定義できます。
border-bottom	境界線（下）の太さ・色・スタイル（線種）を定義します。上記のborder-bottom-(width・color・style)群をまとめて定義できます。
border-left	境界線（左）の太さ・色・スタイル（線種）を定義します。上記のborder-left-(width・color・style)群をまとめて定義できます。
border	境界線（上右下左）の太さ・色・スタイル（線種）を定義します。上記のborder-××-(width・color・style)群をまとめて定義できます。

＜リスト＞

プロパティ	内容
list-style-type	リストの先頭に付く記号のタイプを定義します。
list-style-position	リストの先頭に付く記号の位置を定義します。
list-style-image	リストの先頭に付く記号を画像にするか定義します。
list-style	上記のlist-style-××群をまとめて定義できます。

＜テーブル＞

プロパティ	内容
table-layout	表のレイアウト（表示方法）を定義します。
border-collapse	表の境界線の表示方法を定義します。
border-spacing	表の境界線の間隔を定義します。
empty-cells	空白セルに境界線を表示するかを定義します。

カテゴリー一覧（ホームページの作り方）へ