なぜブラウザが最初の要素に対してのみ二重引用符を表示するのかと思っています。代わりに、2番目の要素には単一引用符があります。
a::before {
content: open-quote;
}<a href="http://www.google.com">Google</a> <br>
<a href="http://www.amazon.com">Amazon</a>回答:
開いている引用符は終了しないため、ブラウザーは引用符をネストしようとしていると「スマート」に仮定し、最初の要素は二重の外側引用符、2番目の要素は単一の内側引用符になります。これは、ネストされた引用で引用句読点が機能する方法です。ウィキペディアおよびその中のネストされた引用への参照を参照してください。
特に、要素の境界は無視されるため、2番目の要素がより深くネストされていても、両方の要素が独自の親要素にネストされていても、同じように機能するため、段落で特に役立ちます。要素（フレージングの異なる種類およびそれらの組み合わせ含むa、br、code、em、span、strong、など、ならびにq自体）。引用がどのようにネストされるかは、任意の時点で生成されたopen-quoteとclose-quoteの数にのみ依存し、アルゴリズムはCSS2仕様のセクション12.3.2で詳しく説明されており、次の注記で終わります：
注意。引用の深さは、ソースドキュメントのネストやフォーマット構造とは無関係です。
そのために、この問題には2つのいわゆる「解決策」があり、どちらも::after疑似要素を追加して、最初のオープンクォートセットのバランスをとる必要があります。
::after最初の要素の引用符を使用して閉じる引用符を挿入することにより、2番目の要素が出現する前に終了するため、引用符のネストはありません。
a::before {
content: open-quote;
}
a::after {
content: close-quote;
}<a href="http://www.google.com">Google</a> <br>
<a href="http://www.amazon.com">Amazon</a>実際に近い引用符をレンダリングしたくない場合でも、を使用して、ブラウザーが2番目の要素の単一引用符を生成しないようにすることができますno-close-quote。
a::before {
content: open-quote;
}
a::after {
content: no-close-quote;
}<a href="http://www.google.com">Google</a> <br>
<a href="http://www.amazon.com">Amazon</a>これは、前の引用符を閉じなかったためです'。次の引用符は1つだけ残ります。
だから擬似要素afterを使うcontent: close-quote
以下のスニペットを参照してください：
次のように、CSSプロパティquotesを使用して、タグの一次引用符と二次引用符を編集することもできます。
a {
quotes: "“" "”" "“" "”";
^ ^ ^ ^
| | | |
| | | |_ #secondary close quotes
| | |_____ #secondary open quotes
| |_________ #primary close quotes
|_____________ #primary open quotes
}以下のスニペットを参照してください：
a {
quotes: "“" "”" "“" "”";
}
a::before{
content: open-quote;
}<a href="http://www.google.com"> Google</a> <br>
<a href="http://www.amazon.com">Amazon</a> <br>
<a href="http://www.google.com"> Google</a> <br>
<a href="http://www.amazon.com">Amazon</a>
open-quote開く引用を。二重引用符文字は参照しません。