有什么方法可以检测移动浏览器中的 HTML 5 语义标签支持吗？答案

【问题标题】：Is there any way to detect HTML 5 Semantic tags support in mobile browsers?有什么方法可以检测移动浏览器中的 HTML 5 语义标签支持吗？
【发布时间】：2011-08-31 07:53:07
【问题描述】：

有什么方法可以检测移动浏览器对 HTML 5 语义标签的支持吗？

标签如下：

<section>、<nav>、<article>、<aside>、<hgroup>、<header>、<footer>

我正在制作具有 2 个版本的移动网站，例如 m.facebook.com 和 touch.facebook.com，我想重定向到支持的手机。在触摸版本中，我使用的是 HTML 5 标签。

例如，Android 1.6 不支持 HTML5，但仍在使用中。所以我想将所有 Android 1.6 设备重定向到 m.mobileversion.com 而不是 touch.mobileversion.com

【问题讨论】：

你说的support是什么意思？除了 IE，怎么可能“不支持”这些元素？另外，你对 hgroup 有用吗？你真的在使用大纲算法吗？除非您正在验证和测试您网站的大纲，否则即使使用大多数元素也没有意义。简单的答案：这些元素目前都没有向您的页面添加任何内容。如果支持让您感到困扰，只需为绝对每个人提供 div 和 span，不要胡思乱想，您可以通过使用一些更新的包装器元素来实现某些目标。

标签： html css mobile-website modernizr

【解决方案1】：

以下是检测浏览器对 HTML5 元素支持的方法列表。

http://diveintohtml5.info/everything.html

【讨论】：

【解决方案2】：

您可以将这些标签用于所有浏览器/平台。首先，您需要确保将这些元素识别为块级元素，这是大多数浏览器所需要的，因为元素本身没有特殊含义（除了语义）。

section, 
nav, 
article, 
aside, 
hgroup, 
header, 
footer {
display: block;
}

然后，对于 IE，只需在页面中包含 HTML5 shim，它使用几行 js 来创建这些元素：

<!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

不要忘记将您的文档类型设置为 HTML5 文档类型：

<!DOCTYPE html>

【讨论】：