7

我想使用一些语义 [X]HTML 标签来代替<div>s: <article>、<product>等<footer>。其中一些已经出现在即将到来的 HTML5 中，但是，它并不完全受支持。

渲染时我可能面临哪些可能的缺点？使用 CSS、JS？

我记得的一个是：IE6 不能克隆它不知道的标签。

4

5 回答 5

7

添加以下 JavaScript 修复程序可使自定义 HTML5 标记在 IE 中工作。事实上，它们适用于我尝试过的所有其他浏览器。我已经使用 HTML5 构建了我的网站，虽然它在 IE6 和 7 中看起来不太好，但它仍然可以工作。这是您放入模板标题的代码：

<!--[if IE]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <style type="text/css"> .clear { zoom: 1;display: block;} </style> <![endif]-->

由于 CSS 的语义特性，使用 HTML5 标记可以增强对 CSS 的控制。实际上，制作网站要容易得多，因为如果您正确使用标签，它们更容易理解。

在任何地方使用 div 都很好，因为如果它们有适当的 ID 和类，它们仍然是语义的，但是使用 HTML5 标签，您可以更快地识别页面结构。

于 2010-06-17T16:27:04.857 回答
3

问题提到了“克隆”，因此如果 IE6 无法管理（我没有）打算使用 JS 克隆自定义元素，IE6 是否可以设置自定义元素的样式（它可以）并不是真正的问题不知道）。

如果这个想法只是为自定义元素设置样式，那么每个浏览器都可以做到。由于 IE6，您需要为自定义元素命名空间，即 <prefix:custom /> 并在 HTML 元素中指定命名空间，即 <html xmlns:prefix="http://domain/path">。

为了在所有浏览器中完全正确（因此 Javascript 使用自定义元素），您还需要提供自定义 DTD，以便自定义元素的命名空间一致地工作，因此 <!DOCTYPE html SYSTEM "http://domain/ path/custom.dtd"> 然后编写 DTD，不幸的是，这不是微不足道的，并且必须包含对它所替换的 HTML DTD 的完整替换。

因此，在应用自定义 DTD、指定自定义命名空间并应用自定义元素后，它们可以在任何浏览器中设置样式，例如 <style>prefix\:custom {background:red;} </style>。

这在所有浏览器中始终有效，但在价值上存在争议。它允许使用一致的有意义的标记与由命名空间清楚地描述的元素，并且不会冒因级联而污染样式的风险并避免 div-itis。

然而，在涉及复杂性的 Web 开发中，它有点像贫民窟，可能得不到足够的回报。

于 2010-12-28T01:29:11.037 回答
2

这并不完全说明您的问题，但<product>就计算机而言不是语义。

一个人可以阅读它并认为“啊哈，这一定是一种产品，在这个购物网站的上下文中，它意味着我可以购买的东西，因此并不意味着像 mathoverflow 上那样‘乘以数量获得的数量’ .com”。这对于任何阅读代码的人来说都是真正有用的，所以它在这个意义上是语义的。

但就计算机解析您的页面为 HTML 而言（或人类在浏览器中查看您的 HTML 页面而不是阅读代码），它只是一个未知标签，因此不会获得任何有用的默认样式（不像<p>标签，它有很好的边距，使东西在屏幕上可读）或行为（不像<a>标签，如果你给它一个href属性，它是可点击的）。

只有当人们通过 HTML5 等规范同意标签的含义时，计算机才会获得语义。

于 2010-06-18T13:29:14.890 回答
2

即使你使用 JS 让 IE 6 “识别” HTML5 标签，你仍然会遇到问题，因为 IE 6 不允许嵌套这样的标签。

另一方面，如果您的网页不是面向应用程序的，而纯粹是为了展示，您也可以使用带有样式的普通旧 XML。它与传统的页面制作方式有些不同，但在 XML 术语中没有“旧”或“新”标签。

请参阅此页面——http: //feeds.feedburner.com/blogspot/MKuf（Google 的博客提要）——作为样式化 XML 的示例。JS 和 DOM API 也同样有效。

于 2010-06-18T07:49:46.777 回答
1

除非您正在为一组非常有限的浏览器进行开发，否则这听起来是个坏主意。如果它在较旧的浏览器中完全可以工作，那么它就不能正常工作；我们还需要几年的时间才能期望所有常见浏览器都能提供良好的 HTML 5 支持。

于 2010-06-17T16:20:37.747 回答