:lang()
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. Itâs been available across browsers since иÑÐ»Ñ 2015 г..
* Some parts of this feature may have varying levels of support.
ÐÑевдо-клаÑÑ CSS :lang() вÑбиÑÐ°ÐµÑ ÑлеменÑÑ Ð¾ÑновÑваÑÑÑ Ð½Ð° ÑзÑке, на коÑоÑом они опÑеделенÑ.
/* ÐÑбиÑÐ°ÐµÑ Ð²Ñе <p>, ÑÑо на английÑком (en) */
p:lang(en) {
quotes: "\201C" "\201D" "\2018" "\2019";
}
ÐÑимеÑание:
Ð HTML ÑзÑк опÑеделÑеÑÑÑ ÐºÐ¾Ð¼Ð±Ð¸Ð½Ð°Ñией аÑÑибÑÑа lang, ÑлеменÑа <meta> и иногда инÑоÑмаÑией из пÑоÑокола (Ñакой, как заголовки HTTP ). ÐÐ»Ñ Ð´ÑÑгиÑ
Ñипов докÑменÑов могÑÑ Ð±ÑÑÑ Ð´ÑÑгие меÑÐ¾Ð´Ñ Ð¾Ð¿ÑÐµÐ´ÐµÐ»ÐµÐ½Ð¸Ñ ÑзÑка.
СинÑакÑиÑ
>ФоÑмалÑнÑй ÑинÑакÑиÑ
Error: could not find syntax for this itemÐаÑамеÑÑ
<language-code>-
<string>, пÑедÑÑавлÑÑÑÐ°Ñ ÑзÑк, коÑоÑÑй Ð²Ñ Ñ Ð¾ÑиÑе оÑобÑаÑÑ. ÐопÑÑÑимÑе знаÑÐµÐ½Ð¸Ñ ÑÐºÐ°Ð·Ð°Ð½Ñ Ð² докÑменÑаÑии HTML.
ÐÑимеÑ
In this example, the :lang() pseudo-class is used to match the parents of quote elements (<q>) using child combinators. Note that this doesn't illustrate the only way to do this, and that the best method to use depends on the type of document. Also note that Unicode values are used to specify some of the special quote characters.
HTML
<div lang="en">
<q>This English quote has a <q>nested</q> quote inside.</q>
</div>
<div lang="fr">
<q>This French quote has a <q>nested</q> quote inside.</q>
</div>
<div lang="de">
<q>This German quote has a <q>nested</q> quote inside.</q>
</div>
CSS
:lang(en) > q {
quotes: "\201C" "\201D" "\2018" "\2019";
}
:lang(fr) > q {
quotes: "« " " »";
}
:lang(de) > q {
quotes: "»" "«" "\2039" "\203A";
}
РезÑлÑÑаÑ
СпеÑиÑикаÑии
| Specification |
|---|
| Selectors Level 4 > # lang-pseudo > |
СовмеÑÑимоÑÑÑ Ñ Ð±ÑаÑзеÑами
СмоÑÑиÑе Ñакже
- Language-related pseudo-classes:
:lang,:dir - HTML
langattribute - BCP 47 - Tags for Identifying Languages