Simple HTMLHTMLリファレンス

Main Menu

おすすめリンク

Site Info.

HTMLリファレンス

CSSリファレンス

その他の記事

CSSリファレンス インデックス

スポンサーリンク

CSSリファレンス

擬似要素Pseudo-elementsTOPCSSSelectorPseudo-element

  1. E:first-letter:first-letter擬似要素
  2. E:first-line:first-line擬似要素
  3. E:after:after擬似要素
  4. E:before:before擬似要素

first-line 擬似要素The :first-line pseudo-element

書式CSSバージョン個別性W3C 仕様書
E:first-lineCSS2.11CR
擬似要素について

first-line擬似要素は、指定した要素のテキストコンテンツの1行目に対してスタイルを適用するためのセレクタです。指定可能な対象要素はブロックレベル要素またはインラインブロックです。また、対象要素の幅(width値)によって1行目の範囲(文字数)も変わることに注意しておく必要があります。

指定可能なプロパティについて

first-line擬似要素が適用されるコンテンツ範囲は行内コンテンツとしての扱いを受けるので、指定可能なプロパティもインラインテキストに適用可能なものに限定されます。

first-line疑似要素のサンプル

<p>This is the source of our confidence - the knowledge that God calls on us to
 shape an uncertain destiny.</p>
p:first-line	{font-weight:bold; font-style:italic;}

This is the source of our confidence - the knowledge that God calls on us to shape an uncertain destiny.

指定した要素の幅が変わると、適用範囲(1行目)も変わることが確認できます。

This is the source of our confidence - the knowledge that God calls on us to shape an uncertain destiny.

スポンサーリンク
Copyright (C) 2010 Simple HTML. All Rights Reserved.