Virgolette, segni del discorso, virgolette; qualunque cosa tu chiami queste forme di punteggiatura, potresti benissimo usarle in modo errato. Diamo una rapida occhiata a cosa è corretto, cosa no e cosa puoi fare all'interno del tuo CSS per assicurarti che le tue virgolette siano formattate correttamente.
Iniziamo illustrando di cosa stiamo parlando qui. Esistono diverse forme di ciò che riconosciamo come virgolette e ognuna ha il suo scopo specifico. Quando si punteggia la scrittura, è necessario utilizzare "virgolette intelligenti" o "virgolette inglesi":
Questo vale sia per il doppio e virgolette singole.
E persino apostrofi:
Sul web, tuttavia, vedrai comunemente "citazioni stupide". Si tratta di versioni dirette, che vengono spesso utilizzate a causa di valori predefiniti impostati in CMS e applicazioni. Anche la tastiera di solito rende difficile l'uso di qualsiasi cosa tranne citazioni stupide.
Le citazioni stupide non devono essere confuse con "numeri primi"; glifi separati che sono usati per indicare la misurazione, come piedi e pollici, coordinate e anche unità più complicate usate nell'orologeria, per esempio.
I minuti sono di solito diversi da citazioni stupide, in quanto si inclinano leggermente, ma questo è ovviamente del tutto in giù per il carattere tipografico.
Codice. Questo è praticamente l'unico posto in cui dovresti tecnicamente usarli.
Come già detto, la tua tastiera non ti aiuterà molto quando stai cercando di usare virgolette corrette. Infatti, mentre scrivo questo, sto lanciando citazioni stupide in tutto il luogo - dovrò fare una ricerca e sostituirmi in seguito!
Se il tuo documento utilizza il set di caratteri utf-8
quindi sarai in grado di incollare direttamente le virgolette corrette. In alternativa, dovrai utilizzare le entità nominate o numeriche HTML o (per i CSS) i valori unicode sfuggiti:
glifo | entità nominata | entità numerica | escape unicode |
“ | “ | “ | \ 201C |
” | ” | ” | \ 201D |
' | ‘ | ‘ | \ 2018 |
' | ’ | ’ | \ 2019 |
Possiamo usare il citazioni
proprietà in CSS per essere sicuri che il nostro e
gli elementi sono decorati correttamente con le virgolette corrette. Il
citazioni
proprietà accetta quattro valori in sequenza, ognuno dei quali definisce quale personaggio utilizzare in ogni circostanza:
Potrebbe sembrare un po 'come questo:
q, blockquote quotes: "\ 201C" "\ 201D" "\ 2018" "\ 2019";
Qui abbiamo come target sia le quotazioni in-line che i blockquotes. Stiamo usando i valori unicode con escape (menzionati nella tabella precedente) per dettare quali glifi verranno utilizzati per aprire e chiudere i nostri elementi di quotazione. Abbiamo dichiarato che vogliamo aprire una doppia virgoletta, quindi un doppio segno di chiusura per chiudere. Gli elementi di quotazione nidificati avranno un unico segno applicato.
Dai un'occhiata a questa demo. In esso vedrai a Nota: Queste virgolette sono inserite in pseudo elementi, quindi solo i browser di supporto visualizzeranno effettivamente le virgolette in questo modo. Ulteriori proprietà ci consentono un controllo ancora maggiore. Possiamo continuare a controllare in modo specifico quegli elementi pseudo, affermando se vorremmo che l'apertura o i segni di chiusura fossero visualizzati a tutti. In questo codice abbiamo modificato il contenuto degli pseudo-elementi, dicendo che in realtà non vogliamo che venga visualizzata una citazione di chiusura. Tuttavia, non tutti visualizzano le virgolette allo stesso modo. Dai un'occhiata a cosa usano i francesi, per esempio. Questi sono chiamati "guillemets" (no, non "guillemots") e sono solo un esempio di virgolette alternative. Fortunatamente, siamo liberi di utilizzare le entità corrette per qualsiasi lingua di cui abbiamo bisogno. E possiamo mirare al Scuse anche per mon français, se ho sbagliato ... Fatti furbo, non ci sono scuse per usare citazioni stupide!Voglio più potere!
q: before, blockquote: before content: open-quote; q: after, blockquote: after content: no-close-quote;
Language Gap
Lang
attributo sul html
elemento specifico (grazie a fliptheweb per quel piccolo suggerimento).
...
html [lang = "fr"] q quote: "\ 00ab" "\ 00bb";
Conclusione
Ulteriori risorse