HTMLタグ/CSS一覧と初心者向けホームページ作成解説集:HTMLタグボード

HTMLタグボードのトップへ戻る ゼロから始めるホームページ作成講座 訪問者優位のWEBデザインTips インターネットで小遣い稼ぎ 今すぐ使える!便利ツール(HTMLタグ辞典など)


HTMLタグボードトップ >> 今すぐ使える!便利ツール >> スタイルシート(CSS)辞典 >> スタイルシートの基本 >> 指定内の最初の子セレクタにのみ働くスタイルシート

指定内の最初の子セレクタにのみ働くスタイルシート

CSS/HTMLの書き方

CSS
親セレクタ 子セレクタ:first-child { プロパティ:値 ; プロパティ:値 ; …}

CSSの詳細情報
対応ブラウザ Windows MAC
IE7.0/FF1.0/NS7.1/OP8.0 SF/IE5.0
CSSレベル CSSレベル2

解説

親セレクタの中に含まれる複数の子セレクタのうち、最初の子セレクタのみに働くスタイルシートの書き方です。例えば、P段落タグの初めのSTRONG要素だけ文字色を変えるといった使い方ができます。

書き方は、親セレクタと子セレクタ名の間に「半角スペース」を入れ、子セレクタの後に「:first-child」と書きます。なお、これは擬似クラスの一種です。

Windows版InternetExplorer5.0/5.5/6.0には対応していません。

CSS/HTMLサンプル

p strong:first-child { color:red ; }

段落内の初めのSTRONG要素の文字色を赤にする サンプル

次のページへ >>