CSSquotes プロパティは、引用符がどのように表示されるかを設定します。

構文

/* キーワード値 */
quotes: none;

/* <string> 値 */
quotes: "«" "»";           /* open-quote 及び close-quote をフランス語の引用符に設定 */
quotes: "«" "»" "‹" "›";   /* 2レベルの引用符を設定 */

/* グローバル値 */
quotes: inherit;
quotes: initial;
quotes: unset;

none
content プロパティの open-quote 及び close-quote の値は引用符を生成しません。
[<string> <string>]+
open-quote 及び close-quote を表す <string> の1つ以上の組。最初の組は、引用符を表示する要素が入れ子になった際の、最上層のものの引用符を表す。以下、順次下位レベルの引用符に対応する。

形式文法

none | [ <string> <string> ]+

HTML

<q>To be or not to be. That's the question!</q>

CSS

q {
  quotes: '"' '"' "'" "'";
}
q::before {
  content: open-quote;
}
q:after {
  content: close-quote;
}

結果

メモ

Firefox 3.5 以降では、 quotes プロパティの初期値は -moz-initial を使用して読み出すことができます。これは以前のバージョンの Firefox では有効ではありません。

仕様書

仕様書 状態 備考
CSS Generated Content Module Level 3
quotes の定義
草案  
CSS Level 2 (Revision 1)
quotes の定義
勧告 初回定義

初期値ユーザエージェントに依存
適用対象すべての要素
継承あり
メディア視覚
計算値指定値
アニメーションの種類個別
正規順序形式文法で定義される一意のあいまいでない順序

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOS 版 SafariSamsung Internet
基本対応Chrome 完全対応 11Edge 完全対応 12Firefox 完全対応 1.5IE 完全対応 8Opera 完全対応 4Safari 完全対応 9WebView Android ? Chrome Android ? Edge Mobile 完全対応 ありFirefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?

凡例

完全対応  
完全対応
実装状況不明  
実装状況不明

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, momdo, Krenair, Sebastianz, ethertank
最終更新者: mfuji09,