content内容(コンテンツ)を挿入する
説明
Safari1ではopen-quote、close-quoteは使用できません。
(Safari2からは対応しているらしい【要確認】)
HTML
<span class="sample">引用</span>
CSS
span.sample {
quotes: '【' '】';
}
span.sample:before {
content: open-quote;
}
span.sample:after {
content: close-quote;
}
quotes: '【' '】';
}
span.sample:before {
content: open-quote;
}
span.sample:after {
content: close-quote;
}
対応ブラウザ
- Netscape6
- Netscape7
- Firefox1
- Firefox2
- Opera8
- Opera9
- Safari1
- Safari2
仕様
CSS Level2
値
値 | 内容 |
---|---|
文字列 | 挿入する文字列を「"」または「'」で括って指定する |
ファイルをURI(URL)で指定 | 画像や音声等のファイルをURI(URL)で指定する |
カウンタ | ここでいうカウンタとは要素内容に自動連番をつけるということです counter()関数、またはcounters()関数により、カウンタ(連番)を呼び出した値が、contentプロパティの値として指定される |
attr() | ()内には属性の名前を指定する contentプロパティを適用する要素の、該当属性で指定されている値が、contentプロパティの値として指定される 例えば、attr(alt)とすると、alt属性で指定されている文字列が要素の直前または直後に挿入される 尚、attrとはAttributeの略で属性という意味です |
open-quote | quotesプロパティで指定されている引用符が挿入される 開始引用符が挿入される |
close-quote | quotesプロパティで指定されている引用符が挿入される 終了引用符が挿入される |
no-open-quote | 引用符は表示されませんが、quotesプロパティで指定されている引用符の入れ子の深さが一階層深くなる |
no-close-quote | 引用符は表示されませんが、quotesプロパティで指定されている引用符の入れ子の深さが一階層浅くなる |
ブラウザバグなど
contentの値に日本語を指定すると文字化けして表示される
その他△上に戻る
content内容(コンテンツ)を挿入する
counterカウンタの値を表示する
counters入れ子になったカウンタの値を表示する
counter-increment要素の連番(カウンタ)の値を進める
counter-reset要素の連番(カウンタ)の値をリセットする
cursorマウスカーソルの形状を指定する
quotes引用符を設定する
@charset外部スタイルシートファイルの文字コードを指定する
@font-faceローカルにはないフォントを読み込んで使用する
@import外部スタイルシートファイルを読み込む
@media表示対象のデバイスを指定する
@page特定のデバイスでの表示範囲を指定する
主要ブラウザに非対応