W3G

Updated 2013.11.07 / Published 2007.02.02

quotesプロパティは contentプロパティで :before { content: open-quote; }, :after { content: close-quote; } を設定している場合に、任意の要素の内容にレンダリング（描画）する開始の引用符と終了の引用符を指定します。開始と終了をセットで指定し、複数指定することも可能です。

値

• <文字列> <文字列> ...
• none

初期値

UA の設定に依存

適用対象

すべての要素

継承

する

メディア

visual

引用符の追加における contentプロパティの値と quotesプロパティの関係は以下のようになっています。

:before { content : open-quote ; }

要素の先頭にquotesプロパティで設定された開始引用符を追加
追加される引用符は入れ子の深さに応じた引用符が使用される

:after { content : close-quote ; }

要素の最後にquotesプロパティで設定された終了引用符を追加
追加される引用符は入れ子の深さに応じた引用符が使用される

:before { content : no-open-quote ; }

quotesプロパティで設定された要素の階層（引用レベル）を一段階深くする
引用符は追加されない

:after { content : no-close-quote ; }

quotesプロパティで設定された要素の階層（引用レベル）を一段階浅くする
引用符は追加されない

要素の階層にあたる引用レベルとは、引用の度合いを指します。たとえば、q:before { content: open-quote; } q:after { content: close-quote; } と指定された q要素が入れ子になっている場合、引用部分の中に、さらに引用が含められることになり、最初の q要素を引用レベル1とすれば、入れ子になっている q要素は引用レベル2となります。

引用レベルは、contentプロパティに "open-quote"、または "no-open-quote" が指定されている要素が登場する度にレベルが1上がり、これに対して "close-quote"、または "no-close-quote" が指定されている要素が登場する度にレベルが1下がることになります。なお、"no-open-quote" と "no-open-quote" は引用レベルを操作するものであり、それ自身では引用符を追加することはできません。

q        { quotes : "“" "”" "‘" "’" ; color : #03f ; }
q:before { content: open-quote; color : red ; }
q:after  { content: close-quote; color : red ; }