Il :lang()
selettore di pseudo classi in CSS corrisponde agli elementi in base al contesto del loro attributo di lingua dato. La lingua in HTML è determinata da una combinazione lang=""
dell'attributo, dell'elemento e delle informazioni dal protocollo come il campo 1
Accept-Language
dell'intestazione della richiesta HTTP . Le stringhe di codice lingua accettabili sono specificate nella specifica HTML 4.0.
:lang(language-code) ( // whatever styling )
:lang(X)
corrisponde se l'elemento è nel linguaggio X. Se la corrispondenza è basata esclusivamente sul fatto che l'identificatore X sia uguale a, o una sottostringa separata da trattini, del valore della lingua dell'elemento, allo stesso modo come se fosse eseguita da "| =" operatore. La corrispondenza di X con il valore della lingua dell'elemento viene eseguita senza distinzione tra maiuscole e minuscole per i caratteri all'interno dell'intervallo ASCII. L'identificatore X non deve essere un nome di lingua valido. È importante notare che il :lang
selettore può essere utilizzato globalmente o in modo specifico su un dato elemento. Sentiti libero di usare selettori discendenti o solo la :lang(language-code)
pseudo classe.
Esempio
Usando l' lang
attributo sul nostro elemento radice (cioè ) possiamo sostituire le virgolette a seconda della lingua specificata.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
q:before ( content: open-quote; ) q:after ( content: close-quote; ) :lang(en) q ( quotes: '“' '”'; ) :lang(fr) q ( quotes: '«' '»'; ) :lang(de) q ( quotes: '»' '«'; )
Inglese (en)
Pellentesque habitant morbi tristique senectus et netus et maschiuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas sempre. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Francese (fr)
Pellentesque habitant morbi tristique senectus et netus et maschiuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas sempre. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Tedesco (de)
Pellentesque habitant morbi tristique senectus et netus et maschiuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas sempre. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
L'attributo language non può essere applicato ai seguenti elementi:
- applet
- base
- basefont
- br
- telaio
- frameset
- iframe
- param
- script
Supporto browser
Cromo | Safari | Firefox | musica lirica | IE | Android | iOS |
---|---|---|---|---|---|---|
Sì | Sì | Sì | Sì | Sì | Sì | Sì |
:lang(X)
è una raccomandazione della specifica CSS Livello 2 Revisione 1 e originariamente raccomandato come parte della specifica CSS Livello 2.
1 I campi di intestazione HTTP sono componenti dell'intestazione del messaggio di richieste e risposte nel protocollo HTTP (Hypertext Transfer Protocol). Definiscono i parametri operativi di una transazione HTTP. Il Accept-Language
campo dell'intestazione della richiesta è simile ad Accetta, ma limita il set di linguaggi naturali preferiti come risposta alla richiesta.