スタイルシート（CSS）の基本

スタイルシート（CSS）の基本

スタイルシート（CSS）を理解するための情報です。スタイルシートを理解されてない方は以下の項目をクリックすると、スタイルシートの基本や書き方を理解できます。

スタイルシート（CSS）の前提知識

• スタイルシート（CSS）とは
• スタイルシート（CSS）を書く前に～HTMLの要素とは～
• スタイルシート（CSS）を書く前に～インライン要素とブロックレベル要素～
• スタイルシート（CSS）の基本的な書き方と必要な知識
• スタイルシート（CSS）をHTMLで使えるようにするための準備（言語指定）

スタイルシート（CSS）の決まり

• スタイルシート（CSS）での色の指定方法
• サイズの表し方
• CSSのレベルについて
• スタイルシート（CSS）の継承とは
• スタイルシート（CSS）のボックスモデル
• HTMLのDOCTYPEスイッチとCSS（標準モードと互換モード）　必読

HTMLからスタイルシート（CSS）の呼び出し方

• 特定の要素にスタイルシート（CSS）を適用させる
• HTMLファイルごとにスタイルシート（CSS）を適用する
• 外部スタイルシート（CSS）を読み込み、一括指定する1
• 外部スタイルシート（CSS）を読み込み、一括指定する2
• スタイルシート（CSS）の優先度を変更する

スタイルシート（CSS）の指定方法

• クラスでスタイルシート（CSS）を指定する
• 特定の要素にのみクラスで指定する
• IDを使ってスタイルシート（CSS）を指定する
• 特定の要素にのみIDで指定する
• 特定の親セレクタに付属する子や孫セレクタにのみスタイルシート（CSS）を適用する
• 特定の子セレクタにのみスタイルシート（CSS）を適用する
• 複数のセレクタに同じプロパティを指定する
• セレクタの次のセレクタにだけ適用させる
• ある属性を持つ特定の要素にスタイルシート（CSS）を適用する
• ある属性が特定の値を持つ要素にのみスタイルシート（CSS）を適用する

スタイルシート（CSS）の応用

• 複数の要素に同じクラス名を指定する
• 指定内の最初の子セレクタにのみ働くスタイルシート（CSS）
• 要素の操作中にのみ働くスタイルシート（CSS）
• セレクタ内の最初の文字にだけ働くスタイルシート（CSS）
• セレクタ内の最初の行にだけ働くスタイルシート（CSS）
• セレクタ内の文字の最初と最後に働くスタイルシート（CSS）
• 複数スタイルシート（CSS）の切り替え

スタイルシート（CSS）とInternetExplorer　必読

• ボックスモデルの解釈の不具合（width,heightプロパティ）
• センタリングの不具合（margin:auto;）
• 要素のはみ出しの処理の不具合（overflow）
• 点線と破線の表示（dashed、dotted）

リファレンス

• ブロックレベル要素一覧
• インライン要素一覧
• 置換要素一覧
• ブラウザ別標準・互換モード対応表
• 16色カラーコード表
• 対応ブラウザについて
• CSSプロパティ一覧
• CSSレベル別プロパティ一覧

最新リファレンス