Css-quotes

提供:Dev Guides
移動先:案内検索

CSS-引用符

説明

_quotes_プロパティは、ネストされた引用の各レベルで使用される引用ペアを定義するために使用されます。

可能な値

  • <string> <string> -オープンクォートとクローズクォートを表すために使用される文字列値のペア。
  • なし-これにより、プロパティコンテンツの値のオープンクォートとクローズクォートが引用符を生成しなくなります。

に適用されます

すべてのHTML要素。

ここに例があります-

<html>
   <head>
      <style type = "text/css">
         q {
            quotes: "<<" ">>" "<" ">";
         }
      </style>
   </head>

   <body>
      <p><q>finddevguides.com</q></p>
      <p><q>finddevguides.com <q>quote</q> inside a java.</q></p>
   </body>
</html>

それは次の結果を生成します-

この違いに対処する必要があるドキュメントでは、:lang疑似クラスを使用して、引用符を適切に変更できます。 次のコードは、使用されている言語に合わせて<blockquote>タグを適切に変更します-

<html>
   <head>
      <style type = "text/css">
        /* Two levels of quotes for two languages*/
         :lang(en) { quotes: '"' '"'  "'"  "'"; }
         :lang(fr) { quotes: "<<" ">>" "<" ">"; }
      </style>
   </head>

   <body>
      <p>...<q lang = "fr">A quote in a paragraph</q>...</p>
   </body>
</html>

:langセレクターは、ドキュメント内のすべての要素に適用されます。 ただし、すべての要素がquotesプロパティを使用するわけではないため、ほとんどの要素では効果が透過的です。

それは次の結果を生成します-