美しい Web サイト
@charset "文字エンコード";
文字エンコードを指定する。
@import url(URL);
@import "URL";
外部スタイルシートのURLを指定する。
{background: background-imageの値 background-repeatの値 background-positionの値 background-colorの値;}
背景に関する属性をまとめて指定する。
{background: 1つ目の背景の値, 2つ目の背景の値, ⋯, 最後の背景の値}
複数の背景に関する属性をまとめて指定する。
※最後の背景の値のみ背景色が設定可。
{background-image: 画像;}
背景画像を指定する。
{background-image: 1つ目の背景画像の値, 2つ目の背景画像の値, ⋯}
複数の背景画像を指定する。
{background-repeat: 繰り返し;}
{background-repeat: 横方向の値 縦方向の値;}
背景画像の繰り返しを指定する。
{background-repeat: 1つ目の繰り返しの値, 2つ目の繰り返しの値, ⋯}
複数の繰り返しを指定する。
{background-position: 水平方向 垂直方向;}
{background-position: 水平方向 水平方向の値 垂直方向 垂直方向の値;}
背景画像の開始位置を指定する。
{background-position: 1つ目の開始位置の値, 2つ目の開始位置の値, ⋯}
複数の背景画像の開始位置を指定する。
{background-color: 色;}
背景色を指定する。
{border-width: 太さ;}
ボーダーの太さをまとめて指定する。
{border-width: 上下の太さ 左右の太さ;}
上下と左右のボーダーの太さを指定する。
{border-width: 上の太さ 左右の太さ 下の太さ;}
上、左右、下のボーダーの太さを指定する。
{border-width: 上の太さ 右の太さ 下の太さ 左の太さ;}
全ボーダーの太さを個別に指定する。
{border-top-width: 太さ;}
上ボーダーの太さを指定する。
{border-bottom-width: 太さ;}
下ボーダーの太さを指定する。
{border-left-width: 太さ;}
左ボーダーの太さを指定する。
{border-right-width: 太さ;}
右ボーダーの太さを指定する。
{border-style: スタイル;}
ボーダーのスタイルをまとめて指定する。
{border-style: 上下のスタイル 左右のスタイル;}
上下と左右のボーダーのスタイルを指定する。
{border-style: 上のスタイル 左右のスタイル 下のスタイル;}
上、左右、下のボーダーのスタイルを指定する。
{border-style: 上のスタイル 右のスタイル 下のスタイル 左のスタイル;}
全ボーダーのスタイルを個別に指定する。
{border-top-style: スタイル;}
上ボーダーのスタイルを指定する。
{border-bottom-style: スタイル;}
下ボーダーのスタイルを指定する。
{border-left-style: スタイル;}
左ボーダーのスタイルを指定する。
{border-right-style: スタイル;}
右ボーダーのスタイルを指定する。
{border-color: 色;}
ボーダーの色をまとめて指定する。
{border-color: 上下の色 左右の色;}
上下と左右のボーダーの色を一括指定する。
{border-color: 上の色 左右の色 下の色;}
上、左右、下のボーダーの色を指定する。
{border-color: 上の色 右の色 下の色 左の色;}
全ボーダーの色を個別に指定する。
{border-top-color: 色;}
上ボーダーの色を指定する。
{border-bottom-color: 色;}
下ボーダーの色を指定する。
{border-left-color: 色;}
左ボーダーの色を指定する。
{border-right-color: 色;}
右のボーダーの色を指定する。
{border: border-widthの値 border-styleの値 border-colorの値;}
すべてのボーダーに関する属性をまとめて指定する。
{border-top: border-top-widthの値 border-top-styleの値 border-top-colorの値;}
上ボーダーに関する属性をまとめて指定する。
{border-bottom: border-bottom-widthの値 border-bottom-styleの値 border-bottom-colorの値;}
下ボーダーに関する属性をまとめて指定する。
{border-left: border-left-widthの値 border-left-styleの値 border-left-colorの値;}
左ボーダーに関する属性をまとめて指定する。
{border-right: border-right-widthの値 border-right-styleの値 border-right-colorの値;}
右ボーダーに関する属性をまとめて指定する。
{color: 色;}
文字色を指定する。
{opacity: ボックスの透明度;}
ボックスの透明度を指定する。
{text-align: 位置;}
テキストの水平方向位置を指定する。
{text-decoration: 装飾;}
テキストの文字装飾を指定する。
{text-indent: 幅;}
テキストのインデントを指定する。
{vertical-align: 位置;}
ボックス内のコンテンツの垂直方向位置を指定する。
{font: font-styleの値 font-weightの値 font-sizeの値/line-heightの値 font-familyの値;}
フォントに関する属性をまとめて指定する。
{font-style: スタイル;}
フォントのスタイルを指定する。
{font-weight: 太さ;}
フォントの太さを指定する。
{font-size: サイズ;}
フォントサイズ（文字のサイズ）を指定する。
{line-height: 高さ;}
行の高さを指定する。
{font-family: フォント名;}
フォントの種類を指定する。
{margin: 幅;}
マージンの幅をまとめて指定する。
{margin: 上下の幅 左右の幅;}
上下と左右のマージンの幅を指定する。
{margin: 上の幅 左右の幅 下の幅;}
上、左右、下のマージンの幅を指定する。
{margin: 上の幅 右の幅 下の幅 左の幅;}
全マージンの幅を個別に指定する。
{margin-top: 幅;}
上マージンの幅を指定する。
{margin-bottom: 幅;}
下マージンの幅を指定する。
{margin-left: 幅;}
左マージンの幅を指定する。
{margin-right: 幅;}
右マージンの幅を指定する。
{padding: 幅;}
パディングの幅をまとめて指定する。
{padding: 上下の幅 左右の幅;}
上下と左右のパディングの幅を指定する。
{padding: 上の幅 左右の幅 下の幅;}
上、左右、下のパディングの幅を指定する。
{padding: 上の幅 右の幅 下の幅 左の幅;}
全パディングの幅を個別に指定する。
{padding-top: パディング幅;}
上パディングを指定する。
{padding-bottom: パディング幅;}
下パディングを指定する。
{padding-left: パディング幅;}
左パディングを指定する。
{padding-right: パディング幅;}
右パディングを指定する。
{list-style: list-style-typeの値 list-style-imageの値 list-style-positionの値;}
リストのマーカーに関する属性をまとめて指定する。
{list-style-type: マーカー;}
リストのマーカーの種類を指定する。
{list-style-image: 画像;}
リストのマーカーに画像を指定する。
{list-style-position: 位置;}
リストのマーカーの位置を指定する。
{width: 幅;}
ボックスの幅を指定する。
{min-width: 幅;}
ボックスの最小の幅を指定する。
{max-width: 幅;}
ボックスの最大の幅を指定する。
{height: 高さ;}
ボックスの高さを指定する。
{min-height: 高さ;}
ボックスの最小の高さを指定する。
{max-height: 高さ;}
ボックスの最大の高さを指定する。
{display: 形式;}
ボックスの表示形式を変更する。
{overflow: 処理;}
ボックスの内容あふれの処理方法を指定する。
{overflow-x: 処理;}
ボックスの幅（x軸）の内容あふれの処理方法を指定する。
{overflow-y: 処理;}
ボックスの高さ（y軸）の内容あふれの処理方法を指定する。
{position: 配置;}
要素の配置方法を指定する。
{top: 位置;}
上からの位置を指定する。
{bottom: 位置;}
下からの位置を指定する。
{left: 位置;}
左からの位置を指定する。
{right: 位置;}
右からの位置を指定する。
{z-index: 値;}
重ね合わせの順序を指定する。
{float: フロート;}
ボックスをフロートさせ、寄せて配置する（後続するボックスは回り込む）。
{clear: 対象;}
ボックスのフロートを解除する。
{table-layout: レイアウト方法;}
テーブル（表）のレイアウト方法を指定する。
{border-collapse: 表示モデル;}
テーブル（表）のボーダーの表示モデルを指定する。
{border-spacing: 間隔;}
ボーダーとセル内容との間隔を指定する。
セレクター {プロパティ: 値;}
セレクターにプロパティと値を設定する。
セレクター {
プロパティ1: 値;
プロパティ2: 値;
⋯
}
複数のプロパティに値を設定する。
セレクター1, セレクター2, セレクター3,⋯ {
プロパティ: 値;
⋯
}
複数のセレクターにプロパティと値を設定する。
セレクター {プロパティ: inherit;}
親要素を継承する。
セレクター {プロパティ: 値!important;}
プロパティの値に最優先の設定をする。
要素名 {⋯}
* {⋯}
親要素 子孫要素 {⋯}
要素名#ID名 {⋯}
※要素名を省略した場合、全ての要素が対象となる。
要素名.クラス名 {⋯}
要素名.クラス名1.クラス名2.クラス名3⋯ {⋯}
※要素名を省略した場合、全ての要素が対象となる。
要素名#ID名.クラス名 {⋯}
※要素名を省略した場合、全ての要素が対象となる。
要素名[属性] {⋯}
要素名[属性="属性値"] {⋯}
※要素名を省略した場合、属性に関連する要素が対象となる。
未アクセスであるものを指定する疑似クラス。
アクセス済みであるものを指定する疑似クラス。
マウスでポイントしたオブジェクトを指定する疑似クラス。
カーソルがフォーカスしたものを指定する疑似クラス。
マウスのボタンが押されているなど、アクティブなオブジェクトを指定する疑似クラス。
連続するすべての要素（ID、クラスなど含む）の最初から数えた個数の中から番号を指定する疑似クラス。
連続するすべての要素（ID、クラスなど含む）の最初から数えた個数の中から奇数や偶数を指定する疑似クラス。
連続するすべての要素（ID、クラスなど含む）の最後から数えた個数の中から番号を指定する疑似クラス。
連続するすべての要素（ID、クラスなど含む）の最後から数えた個数の中から奇数や偶数を指定する疑似クラス。
連続するすべての要素（ID、クラスなど含む）の最初から数えた個数の中から1番目を指定する疑似クラス。
連続するすべての要素（ID、クラスなど含む）の最後から数えた個数の中から1番目を指定する疑似クラス。
連続する同じ要素のみ（ID、クラスなど含む）の最初から数えた個数の中から番号を指定する疑似クラス。
連続する同じ要素のみ（ID、クラスなど含む）の最初から数えた個数の中から奇数や偶数を指定する疑似クラス。
連続する同じ要素のみ（ID、クラスなど含む）の最後から数えた個数の中から番号を指定する疑似クラス。
連続する同じ要素のみ（ID、クラスなど含む）の最後から数えた個数の中から奇数や偶数を指定する疑似クラス。
連続する同じ要素のみ（ID、クラスなど含む）の最初から数えた個数の中から1番目を指定する疑似クラス。
連続する同じ要素のみ（ID、クラスなど含む）の最後から数えた個数の中から1番目を指定する疑似クラス。
エム（文字の高さ）
ポイント
ピクセル
