パソコンQ&A

content CSS辞典

CSSリファレンス 目的順
CSSリファレンス ABC順

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;
}

対応ブラウザ

  • 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-quotequotesプロパティで指定されている引用符が挿入される
開始引用符が挿入される
close-quotequotesプロパティで指定されている引用符が挿入される
終了引用符が挿入される
no-open-quote引用符は表示されませんが、quotesプロパティで指定されている引用符の入れ子の深さが一階層深くなる
no-close-quote引用符は表示されませんが、quotesプロパティで指定されている引用符の入れ子の深さが一階層浅くなる

ブラウザバグなど

contentの値に日本語を指定すると文字化けして表示される

content内容(コンテンツ)を挿入する
counterカウンタの値を表示する
counters入れ子になったカウンタの値を表示する
counter-increment要素の連番(カウンタ)の値を進める
counter-reset要素の連番(カウンタ)の値をリセットする
cursorマウスカーソルの形状を指定する
quotes引用符を設定する
@charset外部スタイルシートファイルの文字コードを指定する
@font-faceローカルにはないフォントを読み込んで使用する
@import外部スタイルシートファイルを読み込む
@media表示対象のデバイスを指定する
@page特定のデバイスでの表示範囲を指定する


主要ブラウザに非対応

このページはリンクフリーです。設定などは自己責任で…
Copy Right kikky

kikky.net