:lang()
The :lang() CSS functional pseudo-class matches elements based on their content language.
Overview
The :lang() CSS functional pseudo-class matches elements based on their content language.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 1 | 12 | 1 | 3.1 | 18 | 2 | |
argument list Comma-separated list of language codes as `:lang(A, B)` | | | 114 | 9 | | 9 |
wildcards Matching language codes with wildcards as `:lang(*-Latn)` | | | 114 | 9 | | 9 |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
CSS
:lang(ja) {
font-family: 'Noto Sans JP', sans-serif;
}
:lang(en) {
font-family: 'Inter', sans-serif;
}Live demo
Use cases
Using :lang()
The :lang() CSS functional pseudo-class matches elements based on their content language.
Cautions
- May not be supported in older browsers.
Accessibility
- Make sure visual changes are conveyed appropriately to assistive technology.
Related links
Powered by web-features