HTML 5 lang属性未按预期工作

时间:2013-06-04 16:20:36

标签: html5 html lang

我正在尝试使用HTML lang属性创建支持多种语言的网站。我在这里找到了这个例子:

<!DOCTYPE html>
<html>
<body>

<p>This is a paragraph.</p>
<p lang="fr">Ceci est un paragraphe.</p>

</body>
</html>

我在我的操作系统中将德语定义为语言,并尝试使用不同的浏览器,但我总是看到法语段落。这就是我所看到的:

这是一个段落。

Ceci est un paragraphe。

2 个答案:

答案 0 :(得分:2)

lang属性指定元素内容的语言。其他一切都取决于用户代理商。网站管理员。

示例用途:

  • screen reader可以使用它来使用适当的发音
  • 浏览器可以使用它来使用syllabification
  • 搜索引擎可以使用它来查找相关内容
  • 网站管理员可以使用它来相应地设置内容,例如使用CSS q
  • quotes元素使用正确的quotation marks

默认情况下,用户代理不应该使用其他语言隐藏内容。想想这些例子:

  • <p lang="en">I met a nice guy there. His name was <span lang="de">Max Mustermann</span>.
  • <p lang="en">He said to me <q lang="de">Halt! Stopp!</q>.</p>
  • <p lang="en">The original title is <cite>Faust. Eine Tragödie.</cite>.</p>

当隐藏不同语言的内容时,它们会显示为:

  
      
  • 我在那里遇到了一个好人。他的名字是。
  •   
  • 他对我说。
  •   
  • 原标题是。
  •   

似乎您想用它来实现多语言页面。虽然这可以通过JS / CSS实现,但它通常不是最好的方法。通常,您可能希望为每种语言使用单独的网页,并将翻译与link type alternate和相应的hreflang相关联:

<!-- on the page <example.com/en/about-me>, you could link to the German translation -->
<link rel="alternate" hreflang="de" href="/de/ueber-mich" />

答案 1 :(得分:0)

lang属性位于整个页面的HTML标记上,specifies what the default language of the page is。它描述内容的元数据。你正在尝试用它做什么并不是它的作用。

您可以通过使用JQuery隐藏页面中lang属性与您指定的内容不相等的所有标记来执行您尝试执行的操作,但您必须研究如何发现内容系统语言在浏览器中(假设可能)。如果你不想将JQuery拖入其中,你可以自己走DOM。