lang

lang 全局属性 帮助定义元素的语言:编写不可编辑元素所用的语言,或用户应编写可编辑元素所用的语言。该属性包含一个采用 RFC 5646: Tags for Identifying Languages (also known as BCP 47) 中定义的格式的 "语言标签"。

¥The lang global attribute helps define the language of an element: the language that non-editable elements are written in, or the language that the editable elements should be written in by the user. The attribute contains a single "language tag" in the format defined in RFC 5646: Tags for Identifying Languages (also known as BCP 47).

注意:lang 的默认值是空字符串,这意味着语言未知。因此,建议始终为此属性指定适当的值。

¥Note: The default value of lang is the empty string, which means that the language is unknown. Therefore, it is recommended to always specify an appropriate value for this attribute.

Try it

如果属性值为空字符串(lang=""),则语言设置为未知;如果语言标签根据 BCP47 无效,则将其设置为无效。

¥If the attribute value is the empty string (lang=""), the language is set to unknown; if the language tag is not valid according to BCP47, it is set to invalid.

即使设置了 lang 属性,也可能不会被考虑,因为 xml:lang 属性具有优先权。

¥Even if the lang attribute is set, it may not be taken into account, as the xml:lang attribute has priority.

对于 CSS 伪类 :lang,如果两个无效语言名称不同,则它们也不同。因此,虽然 :lang(es)lang="es-ES"lang="es-419" 都匹配,但 :lang(xyzzy) 不会与 lang="xyzzy-Zorp!" 匹配。

¥For the CSS pseudo-class :lang, two invalid language names are different if their names are different. So while :lang(es) matches both lang="es-ES" and lang="es-419", :lang(xyzzy) would not match lang="xyzzy-Zorp!".

语言标签语法

¥Language tag syntax

完整的 BCP47 语法足够深入,可以标记极其特定的语言方言,但大多数用法要简单得多。

¥The full BCP47 syntax is in-depth enough to mark extremely specific language dialects, but most usage is much simpler.

语言标签由连字符分隔的语言子标签组成,其中每个子标签指示语言的特定属性。3 个最常见的子标签是:

¥A language tag is made of hyphen-separated language subtags, where each subtag indicates a certain property of the language. The 3 most common subtags are:

语言子标签

必需的。定义基本语言的 2 或 3 字符代码,通常以全小写形式编写。例如,英语的语言代码是 en,巴德式的语言代码是 bdz

脚本子标签

可选的。该子标签定义了该语言使用的书写系统,并且始终为 4 个字符长,且第一个字母大写。例如,法语盲文是 fr-Braija-Kana 是用片假名字母书写的日语。如果该语言以高度典型的方式书写,例如拉丁字母的英语,则无需使用此子标签。

区域子标签

可选的。该子标签定义特定位置的基本语言的方言,并且是与国家/地区代码匹配的 2 个大写字母,或者是与非国家/地区区域匹配的 3 个数字。例如,es-ES 代表西班牙使用的西班牙语,es-013 代表中美洲使用的西班牙语。"国际西班牙语" 就是 es

如果两者都存在,则脚本子标签位于区域子标签之前 - ru-Cyrl-BY 是俄语,用西里尔字母书写,如白俄罗斯所说。

¥The script subtag precedes the region subtag if both are present — ru-Cyrl-BY is Russian, written in the Cyrillic alphabet, as spoken in Belarus.

要查找某种语言的正确子标签代码,请尝试 语言子标签查找

¥To find the correct subtag codes for a language, try the Language Subtag Lookup.

无障碍问题

¥Accessibility concerns

WCAG 成功标准 3.1.1 要求以 '程序确定' 的方式指定页面语言(即通过 lang 属性)。

¥WCAG Success Criterion 3.1.1 requires that a page language is specified in a way which may be 'programmatically determined' (i.e. via the lang attribute).

WCAG 成功标准 3.1.2 要求包含不同语言部分的页面也指定这些部分的语言。同样,lang 属性是正确的机制。

¥WCAG Success Criterion 3.1.2 requires that pages with parts in different languages have the languages of those parts specified too. Again, the lang attribute is the correct mechanism for this.

这些要求的目的主要是允许屏幕阅读器等辅助技术调用正确的发音。

¥The purpose of these requirements is primarily to allow assistive technologies such as screen readers to invoke the correct pronunciation.

例如,此站点 (MDN) 上的语言菜单包含每个条目的 lang 属性:

¥For example, the language menu on this site (MDN) includes a lang attribute for each entry:

html
<div class="dropdown-container language-menu">
  <button
    id="header-language-menu"
    type="button"
    class="dropdown-menu-label"
    aria-haspopup="true"
    aria-owns="language-menu"
    aria-label="Current language is English. Choose your preferred language.">
    English
    <span class="dropdown-arrow-down" aria-hidden="true"></span>
  </button>
  <ul
    id="language-menu"
    class="dropdown-menu-items right show"
    aria-expanded="true"
    role="menu">
    <li lang="ca" role="menuitem">
      <a href="/ca/docs/Web/HTML/Global_attributes/lang" title="Catalan">
        <bdi>Català</bdi>
      </a>
    </li>
    <li lang="de" role="menuitem">
      <a href="/de/docs/Web/HTML/Globale_Attribute/lang" title="German">
        <bdi>Deutsch</bdi>
      </a>
    </li>
    <li lang="es" role="menuitem">
      <a href="/es/docs/Web/HTML/Atributos_Globales/lang" title="Spanish">
        <bdi>Español</bdi>
      </a>
    </li>
    <li lang="fr" role="menuitem">
      <a href="/fr/docs/Web/HTML/Attributs_universels/lang" title="French">
        <bdi>Français</bdi>
      </a>
    </li>
    <li lang="ja" role="menuitem">
      <a href="/ja/docs/Web/HTML/Global_attributes/lang" title="Japanese">
        <bdi>日本語</bdi>
      </a>
    </li>
    <li lang="ko" role="menuitem">
      <a href="/ko/docs/Web/HTML/Global_attributes/lang" title="Korean">
        <bdi>한국어</bdi>
      </a>
    </li>
    <li lang="pt-BR" role="menuitem">
      <a
        href="/pt-BR/docs/Web/HTML/Global_attributes/lang"
        title="Portuguese (Brazilian)">
        <bdi>Português (do&nbsp;Brasil)</bdi>
      </a>
    </li>
    <li lang="ru" role="menuitem">
      <a href="/ru/docs/Web/HTML/Global_attributes/lang" title="Russian">
        <bdi>Русский</bdi>
      </a>
    </li>
    <li lang="uk" role="menuitem">
      <a
        href="/uk/docs/Web/HTML/%D0%97%D0%B0%D0%B3%D0%B0%D0%BB%D1%8C%D0%BD%D1%96_%D0%B0%D1%82%D1%80%D0%B8%D0%B1%D1%83%D1%82%D0%B8/lang"
        title="Ukrainian">
        <bdi>Українська</bdi>
      </a>
    </li>
    <li lang="zh-Hans" role="menuitem">
      <a
        href="/zh-CN/docs/Web/HTML/Global_attributes/lang"
        title="Chinese (Simplified)">
        <bdi>中文 (简体)</bdi>
      </a>
    </li>
    <li>
      <a
        href="/en-US/docs/Web/HTML/Global_attributes/lang$locales"
        rel="nofollow"
        id="translations-add">
        Add a translation
      </a>
    </li>
  </ul>
</div>

规范

Specification
HTML Standard
# attr-lang

¥Specifications

浏览器兼容性

BCD tables only load in the browser

¥Browser compatibility

也可以看看

¥See also