CSS content 属性

定義と用法

content 属性と :before 及び :after 伪要素を組み合わせて、生成コンテンツを挿入します。

説明

この属性は、要素の前にまたは後に配置される生成コンテンツを定義します。デフォルトでは、これは行内コンテンツですが、このコンテンツが作成するボックスのタイプは属性 display で制御できます。

も参照してください：

CSS リファレンスマニュアル：CSS :before 伪元素

CSS リファレンスマニュアル：CSS :after 伪元素

HTML DOM リファレンスマニュアル：content 属性

例

以下の例では、各リンクの後に括弧内の URL を挿入します：

a:after
  {
  content: " (" attr(href) ")";
  }

実際に試してみてください

CSS 文法

content: normal|none|counter|attr|string|open-quote|close-quote|no-open-quote|no-close-quote|url|initial|inherit;

属性値

値 説明
none 　
normal 　
content specifications 　
inherit 親要素から content 属性の値を継承すべきであることを規定しています。

技術的詳細

デフォルト値： normal
継承性： no
バージョン： CSS2
JavaScript 文法： object.style.content="url(beep.wav)"

ブラウザのサポート

テーブルの数字には、その属性を完全にサポートする最初のブラウザのバージョンが記載されています。

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.0 1.0 4.0