De :lang()pseudo-klassenkiezer in CSS komt overeen met elementen op basis van de context van hun gegeven taalkenmerk. De taal in HTML wordt bepaald door een combinatie van het lang=""attribuut, het element en door informatie uit het protocol, zoals het veld HTTP Accept-Languagerequest-header 1 . Aanvaardbare taalcode-strings worden gespecificeerd in de HTML 4.0-specificatie.
:lang(language-code) ( // whatever styling ):lang(X)komt overeen als het element in taal X is. Of de overeenkomst uitsluitend is gebaseerd op het feit dat ID X gelijk is aan, of een door koppelteken gescheiden substring van, de taalwaarde van het element, op dezelfde manier alsof deze wordt uitgevoerd door de "| =" operator. Het matchen van X met de taalwaarde van het element wordt niet hoofdlettergevoelig uitgevoerd voor tekens binnen het ASCII-bereik. De identifier X hoeft geen geldige taalnaam te zijn. Het is belangrijk op te merken dat de :langselector globaal of specifiek op een bepaald element kan worden gebruikt. Voel je vrij om afstammende selectors of alleen de :lang(language-code)pseudo-klasse te gebruiken.
Voorbeeld
Met behulp van het langattribuut op ons root-element (ie ) kunnen we aanhalingstekens vervangen, afhankelijk van de gespecificeerde taal.
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: '»' '«'; )Engels (en)
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 sempre. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Frans (fr)
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 sempre. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Duits (de)
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 sempre. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Het taalkenmerk kan niet worden toegepast op de volgende elementen:
- applet
- baseren
- basislettertype
- br
- kader
- frameset
- iframe
- param
- script
Browser-ondersteuning
| Chrome | Safari | Firefox | Opera | D.W.Z | Android | iOS |
|---|---|---|---|---|---|---|
| Ja | Ja | Ja | Ja | Ja | Ja | Ja |
:lang(X) is een aanbeveling van de CSS Level 2 Revision 1-specificatie en origneel aanbevolen als onderdeel van de CSS Level 2-specificatie.
1 HTTP-headervelden zijn componenten van de berichtheader van verzoeken en antwoorden in het Hypertext Transfer Protocol (HTTP). Ze definiëren de bedrijfsparameters van een HTTP-transactie. Het Accept-Languageveld request-header is vergelijkbaar met Accepteren, maar beperkt de set natuurlijke talen die de voorkeur hebben als reactie op het verzoek.