Le virgolette aperte non vengono terminate, quindi il browser presume "intelligente" che stai per annidare le virgolette, risultando in virgolette doppie esterne per il primo elemento e singole virgolette interne per il secondo. Ecco come funziona la punteggiatura delle virgolette nelle virgolette annidate. Vedi Wikipedia e i riferimenti alle citazioni annidate in esso.
In particolare, i confini degli elementi vengono ignorati, quindi non importa anche se il tuo secondo elemento è nidificato più in profondità o se entrambi gli elementi sono nidificati nei propri elementi padre, funzionerà comunque allo stesso modo, il che lo rende particolarmente utile nei paragrafi che potrebbero contenere diversi tipi e combinazioni di elementi fraseggio ( a
, br
, code
, em
, span
, strong
, ecc, così come q
se stesso). Come le citazioni sono annidati dipende esclusivamente dal numero di open-quote
s e close-quote
s che sono stati generati in qualsiasi punto nel tempo, e l'algoritmo è dettagliato nel capitolo 12.3.2 delle specifiche CSS2 , che termina con la seguente nota:
Nota. La profondità della citazione è indipendente dalla nidificazione del documento di origine o dalla struttura di formattazione.
A tal fine, ci sono due cosiddette "soluzioni" a questo problema, entrambe implicano l'aggiunta di uno ::after
pseudo-elemento per bilanciare il primo insieme di virgolette aperte.
Inserendo virgolette chiuse utilizzando ::after
la citazione per il primo elemento viene terminata prima che venga incontrato il secondo elemento, quindi non vi è alcuna nidificazione delle virgolette.
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>
Se in realtà non si desidera visualizzare virgolette chiuse, è comunque possibile impedire al browser di generare virgolette singole per il secondo elemento utilizzando 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>
open-quote
non aprire un preventivo. Non si riferisce a virgolette doppie.