CSS 参考手册

CSS @规则(RULES)

CSS 属性大全

CSS counter-increment 属性 CSS3 columns 属性

CSS content属性の使用方法と例

content CSS属性と::beforeと::afterの組み合わせて使用して、要素内の内容を生成します。

以下のテーブルは、この属性の使用方法とバージョン履歴、およびJavaScriptスクリプトでの使用構文を示しています。

デフォルト値：	説明
適用範囲：	::beforeと::after の
継承：	ありません
アニメーション可能：	いいえ。参照してくださいアニメーション属性。
バージョン：	CSS 2、3
JavaScriptの構文：	object.style.content="counter"

contentの使用構文

この属性の構文は以下の通りです：

content:　normal　|　none　|　counter　|　string　|　url(url)　|　attr(attribute)　|　open-quote　|　close-quote　|　no-右引号を挿入します。これらの値は、quotes属性の適切な文字列に置き換わります。-quote　|　no-no-quote　|　initial　|　inherit

以下の例は、content属性の使用方法を示します。

　　例1h
　　　::before {
　　　content: "Chapter: ";
　　display: inline;

}/テストをしてみて‹

この関数は、指定された属性の値を挿入するために選択された要素の前にまたは後に挿入します。選択されたセレクタのテーマに指定された属性がない場合、空文字列を挿入します。› display

CSS属性は、content属性で生成される内容がブロックボックスに配置されるか、インラインボックスに配置されるかを制御します。

属性値

以下のテーブルは、この属性の値を説明します。	値
説明	normal for:beforeと:after仮想要素、
これはデフォルト値であり、どの値も計算しません。	noneの仮想要素
counter	発生しません。counter-resetこの値はcontentをカウンタに設定します。詳細については、以下を参照してください。counter-incrementおよび
属性。	串
指定された文字列（テキスト内容）を挿入します。url(attribute	url
の値url()は、外部リソース（例えば画像）を指定します。リソースや画像が表示されない場合、それを無視したり、プレースホルダーを表示します。attr(attribute	) この関数は、指定された属性の値を挿入するために選択された要素の前にまたは後に挿入します。選択されたセレクタのテーマに指定された属性がない場合、空文字列を挿入します。　注意：
右引号を挿入します。これらの値は、quotes属性の適切な文字列に置き換わります。-close	属性名は引用符で囲まないこと。
no-close	左引号を挿入します。これらの値は、quotes属性の適切な文字列に置き換わります。
開頭の引号を表示しないで、引号のネストレーションレベルを増加（減少）します。-右引号を挿入します。これらの値は、quotes属性の適切な文字列に置き換わります。-close	open
開頭の引号を表示しないで、引号のネストレーションレベルを増加（減少）します。-no-close	quote
右引号を表示しないで、引号のネストレーションレベルを増加（減少）します。	initial
この属性をデフォルト値に設定します。	inherit

指定すると、関連する要素は親要素のcontent属性の値を使用します。

ブラウザ互換性

	content属性のブラウザの互換性について、以下のテーブルの数字は、その属性をサポートするブラウザの最低バージョン番号を示します；すべての主要ブラウザがこの属性をサポートしています。 1+ Firefox1+ 警告： 8+ Google Chrome 1+ Apple Safari 4+

Opera 警告： 7Internet Explorer8以下のバージョンではサポートされていません。IE指定された有効値がある場合のみサポートされます。

さらに詳しく

以下のチュートリアルを参照してください：CSSの仮想要素。

関連属性：counter-reset、counter-increment。

CSS counter-increment 属性 CSS3 columns 属性