Webコンテンツを作成するにはHTMLの他にCSSの理解が必須となっています。CSSを使えばページのスタイルを効率的に変更することが可能です。
本リファレンスでは,主なCSSの項目について説明しています。また,説明の中ではサンプルとしてCSS,HTMLのソースに加え,Internet ExplorerとFirefoxでの表示結果を確認できます。
また,CSSの基本的な使い方については「CSSの基本」を参考にしてください。/p>
機能別
文字・フォント関連
- color - 前景色を指定する
- display - 要素の表示形式を指定する
- font - フォント関連の設定を一括設定
- font-family - 表示フォントの種類を指定する
- font-size - 文字のサイズを指定する
- font-style - フォントの形状を指定する
- font-variant - スモール・キャピタルの設定
- font-weight - 文字の太さを指定する
- letter-spacing - 文字同士の間隔を指定する
- line-height - 行の高さの設定
- overflow - 領域をあふれた文字列の扱いを指定する
- text-align - 水平方向の配置位置を指定する
- text-decoration - 文字列に装飾を加える
- text-indent - 段落の字下げを指定する
- text-transform - アルファベットの大文字と小文字の変換を行う
- white-space - 空白や改行,タブの表示形式を指定する
- <a>タグの疑似クラスを用いた色指定
配置関連
- bottom - 要素の配置位置を指定する
- clear - 回り込みを解除する
- float - 回り込みを行う
- height - 要素の高さを指定する
- left - 要素の配置位置を指定する
- position - 配置方法を指定する
- right - 要素の配置位置を指定する
- top - 要素の配置位置を指定する
- vertical-align - 垂直方向の配置位置を指定する
- width - 要素の幅を指定する
- z-index - 要素の重なり順を指定する
背景関連
- background - 背景関連の設定を一括設定する
- background-attachment - 背景画像を固定する
- background-color - 背景色を指定する
- background-image - 背景画像を指定する
- background-position - 背景画像の表示位置を指定する
- background-repeat - 背景の繰り返しを指定する
表・枠線関連
- border - 枠線のスタイルを一括して指定する
- border-top - 上枠線のスタイルを一括して指定する
- border-bottom - 下枠線のスタイルを一括して指定する
- border-left - 左枠線のスタイルを一括して指定する
- border-right - 右枠線のスタイルを一括して指定する
- border-collapse - セル同士の枠線を一体化する
- border-color - 枠線の色を指定する
- border-top-color - 上枠線の色を指定する
- border-bottom-color - 下枠線の色を指定する
- border-left-color - 左枠線の色を指定する
- border-right-color - 右枠線の色を指定する
- border-spacing - セル同士の間隔を指定する
- border-style - 枠線の種類を指定する
- border-top-style - 上枠線の種類を指定する
- border-bottom-style - 下枠線の種類を指定する
- border-left-style - 左枠線の種類を指定する
- border-right-style - 右枠線の種類を指定する
- border-width - 枠線の幅を指定する
- border-top-width - 枠線の幅を指定する
- border-bottom-width - 枠線の幅を指定する
- border-left-width - 枠線の幅を指定する
- border-right-width - 枠線の幅を指定する
- table-layout - 表幅の計算方法を指定する
余白関連
- margin - ブロック要素の外側の余白を指定する
- margin-top - ブロック要素の外側の上余白を指定する
- margin-bottom - ブロック要素の外側の下余白を指定する
- margin-left - ブロック要素の外側の左余白を指定する
- margin-right - ブロック要素の外側の右余白を指定する
- padding - ブロック要素の内側の余白を指定する
- padding-top - ブロック要素の内側の上余白を指定する
- padding-bottom - ブロック要素の内側の下余白を指定する
- padding-left - ブロック要素の内側の左余白を指定する
- padding-right - ブロック要素の内側の右余白を指定する
リスト関連
- list-style - リストに関して一括して指定する
- list-style-image - リスト行頭に所定の画像を付加する
- list-style-position - リスト記号の表示位置を指定する
- list-style-type - リストの行頭記号の指定