セレクタ内の最初の行にだけ働くスタイルシート(CSS)

セレクタ:first-line { プロパティ:値 ; …}

CSS/HTMLの書き方

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

CSSの詳細情報
対応ブラウザ Windows MAC
IE 5.5以降/FF1.0/NS7.1/OP8.0 SF/IE5.0
CSSレベル CSSレベル1
対象 ブロックレベル要素

解説

セレクタの最初の行だけに働くスタイルシートの書き方です。

例えば、段落の最初の行だけ文字を太くしたり、背景を付けたりすることができます。

このスタイルシートの対象はブロックレベル要素です。

それ以外の要素には無効です。

なお、ここで指定する「:first-line」は擬似要素です。

CSSの書き方は、スタイルシートを適用したいセレクタ名の後に「:first-line」を追加します。

CSS/HTMLサンプル

p:first-line { background:#ffdff9 ; font-weight:bold ; }

段落の最初の行だけ背景を付け、文字を太くする サンプル

【厳選】合わせて読みたいおすすめ書籍

WEB制作支援サイトのHTMLタグボードだからオススメできる厳選書籍です。私が読んでいない本はオススメしません。

HTMLやCSS、Webデザインを体系的に学ぶなら

CSSを駆使したモダンなWebデザインを学ぶなら

最新情報をチェックしよう!