content
内容の生成

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
適用対象
継承 継承しない
初期値 空文字
メディア
  • all

要素の前後に内容(文字列や画像等)を追加するプロパティです。

このプロパティは、疑似要素:before または :after と組み合わせて使用します。


content: "文字列";
content: url(icon.gif);
content: attr(title);

プロパティの値
プロパティ名 説明
content "文字列" 指定した文字列を追加する (文字列は引用符で囲む)
url(URI) 指定したURIの画像等を追加する
attr(属性名) 指定した属性の値を表示する
open-quote quotesプロパティで設定されている開始引用符を挿入する (入れ子の深さに応じた引用符が使用される)
close-quote quotesプロパティで設定されている終了引用符を挿入する (入れ子の深さに応じた引用符が使用される)
no-open-quote 開始引用符を挿入したことにして、quotesプロパティで設定されている引用符の入れ子の深さを一段階深くする (引用符は挿入されない)
no-close-quote 終了引用符を挿入したことにして、quotesプロパティで設定されている引用符の入れ子の深さを一段階浅くする (引用符は挿入されない)
  • SafariとChromeは、引用符関連の値(open-quoteclose-quoteno-open-quoteno-close-quote)に対応していないようです。
  • 追加される文字列中に\Aを挿入すると、その部分で改行させることができます。
  • カウンタに関連する内容は省略させていただきました。
このプロパティに関連する目的別リファレンス
要素の前後に内容を追加する
引用符を設定する