引用符プロパティ

最終更新：2026-09-13

quotes 引用符プロパティ

quotes プロパティは、q 要素や content の open-quote/close-quote キーワードが使う引用符をカスタマイズします。デフォルトではブラウザが言語に基づいて選択します。複数の引用符ペアに対応しているため、入れ子の引用で自動的にスタイルが切り替わります。国際化された組版において重要なツールです。

カテゴリ
初期値	depends on user agent
継承	はい
適用対象
アニメーションタイプ
CSS バージョン	CSS2
状態	標準

📝 構文

quotes: none | auto | <string> <string>+;

⚙️ 値

値	タイプ	説明
`none \| auto`	キーワード	なしまたは自動
`<string> <string>+`	値	カスタム引用符ペア

▶ 例

以下のコードを編集して、プレイグラウンドでライブ結果を確認してください：

▶ 試す

🌐 ブラウザーサポート

ブラウザー	Chrome	Edge	Firefox	Safari	Opera
quotes	✓ v10	✓ v12	✓ v1	✓ v1	✓ v1
すべての主要ブラウザーでサポート

ヒント： 中国語は一般的に「」や『』を、英語は " " や ' ' を使います。サイトの言語に合わせてペアを設定してください。

ヒント： quotes は継承されるプロパティです。親に設定するとすべての子孫が同じ引用符スタイルを使います。

❓ よくある質問

Qquotes と content で引用符を直接挿入する違いは？

Aquotes は引用符文字を定義し、content: open-quote/close-quote と組み合わせることで各入れ子レベルに応じたペア（第 1 レベルは「」、第 2 レベルは『』…）に自動的に切り替わります。content で固定文字列を直接挿入すると入れ子レベルを認識できないため、入れ子引用はすべて同じペアで表示されます。多階層の入れ子引用には quotes と open-quote を使います。

Q自動的な引用符を無効にするには？

Aquotes: none を設定すると、q 要素や content: open-quote は引用符を生成しなくなります。quotes が影響するのは open-quote/close-quote キーワードだけで、content に直接書いた文字列には影響しません。完全にカスタマイズするには、content: "「" のように仕組みを迂回します。

Qq 要素に中国語の引用符を設定するには？

A中国語の慣例では外側に「」、内側に『』を使います。quotes: "“" "”" "‘" "’"; のように指定します。最初のペアが外側の開始／終了、2 番目のペアが入れ子用で、最大 4 階層まで対応します。設定すると q 要素は入れ子の深さに応じて自動的に切り替わります。各引用符ペアはスペースで区切り、各文字を自分の引用符で囲むことを忘れないでください。

Qquotes は継承されますか？

Aはい。quotes は継承されるプロパティです。文書ルートや引用コンテナに一度設定するだけで、q 要素を含むすべての子孫に同じペアが適用されます。デフォルト値 auto は、要素の lang 属性とロケールに基づいてブラウザが選択します（たとえば中国語ページは自動的に「」、英語ページは "" になります）。