:lang()Selektor pseudo klasy w CSS pasuje do elementów opartych na kontekście ich danego atrybutu języka. Język w HTML jest określany przez kombinację lang=""atrybutu, elementu i informacji z protokołu, takich jak pole Accept-Languagenagłówka żądania HTTP 1 . Dopuszczalne ciągi kodu języka są określone w specyfikacji HTML 4.0.
:lang(language-code) ( // whatever styling ):lang(X)dopasowuje, jeśli element jest w języku X. Czy dopasowanie opiera się wyłącznie na tym, że identyfikator X jest równy wartości językowej elementu lub jest to podciąg oddzielony łącznikami, w taki sam sposób, jak gdyby było wykonywane przez „| =” operator. Dopasowanie X do wartości języka elementu jest wykonywane bez rozróżniania wielkości liter dla znaków z zakresu ASCII. Identyfikator X nie musi być prawidłową nazwą języka. Ważne jest, aby pamiętać, że :langselektor może być używany globalnie lub specjalnie dla dowolnego elementu. Możesz swobodnie używać selektorów potomków lub samej :lang(language-code)pseudoklasy.
Przykład
Używając langatrybutu w naszym głównym elemencie (tj. ) Możemy zamienić cudzysłowy w zależności od podanego języka.
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: '»' '«'; )Angielski (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 semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Francuski (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 semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Niemiecki (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 semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Atrybutu języka nie można zastosować do następujących elementów:
- aplet
- baza
- basefont
- br
- rama
- zestaw ramek
- iframe
- param
- scenariusz
Wsparcie przeglądarki
| Chrom | Safari | Firefox | Opera | TO ZNACZY | Android | iOS |
|---|---|---|---|---|---|---|
| tak | tak | tak | tak | tak | tak | tak |
:lang(X) jest zaleceniem specyfikacji CSS Level 2 Revision 1 i oryginalnie zalecanym jako część specyfikacji CSS Level 2 spec.
1 Pola nagłówka HTTP są składnikami nagłówka wiadomości żądań i odpowiedzi w protokole Hypertext Transfer Protocol (HTTP). Definiują parametry operacyjne transakcji HTTP. Pole Accept-Languagenagłówka żądania jest podobne do pola Akceptuj, ale ogranicza zestaw języków naturalnych, które są preferowane jako odpowiedź na żądanie.