【问题标题】:Modernizr vs HTML shivModernizr 与 HTML shiv
【发布时间】:2013-09-07 11:31:59
【问题描述】:

如果我只需要旧版浏览器来识别 HTML5 标签,我应该使用Modernizr 还是流行的HTML5 shiv? 而且,如果我不需要设置这个 HTML5 标签的样式,我是否需要浏览器来识别它们?还是只有在为这些标签添加 CSS 时才需要?

谢谢!

【问题讨论】:

  • 您只需要 HTML5 shiv 即可通过 CSS 为 html5 标签添加样式。 Modernizr 还包括 HTML5 shiv,所以它是一个超集
  • 我想添加 Modernizr 更多的是检测 HTML5 功能(如音频格式、css 样式规则、本地存储...)而不是 HTML5 标签支持

标签: javascript internet-explorer html browser


【解决方案1】:

html5shiv 基本上允许 IE 识别 HTML5 元素并为其设置样式,而 Modernizr 提供与浏览器支持的相同的加号功能检测。

所以要回答你的问题,HTML5 shiv 应该足以识别 IE 中的 HTML5 标签。 (注意我在这里说 IE,因为这是 html5shiv 的目标,不确定你说的旧浏览器是什么意思)

对于第二部分,即使您不想设置 HTML5 标签的样式,我还是建议您使用 shiv,因为浏览器可能会错误地显示它们,或者根本不显示它们,所以最好是安全的。

【讨论】:

  • 太好了,我想知道即使我没有设置标签样式,是否有必要使用 shiv。太糟糕了,它只适用于 IE(当我说旧版浏览器时,我指的是 Firefox 1 或 2,或者任何不支持 HTML5 的 Chrome/Opera 版本)
  • 现在用 FF1 找人不太常见 ;)
  • 根据我在Wikipedia 中读到的内容,您错了。
【解决方案2】:

HTML5 Shiv 更小,除非您需要 Modernizr 的某些检测功能,否则请选择 shiv。

文件的大小非常重要,因为它始终位于 html 文档的头部,并且在完全执行之前会阻止其他资源的下载。

由于只有旧版浏览器才需要,所以我使用以下代码:

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

您可以删除不使用的 html 标签,但您将无法使用 Google 托管的文件。

【讨论】:

  • 这个检测为我提供了什么?我只写html和Js。它假设将样式应用于所有元素(包括 html5 元素),那么“检测”是什么意思?你能提供例子吗?
【解决方案3】:

如果浏览器支持特定的 CSS 或 HTML5 功能,您也可以使用 Modernizr 加载特定的文件。

假设浏览器不支持'canvas'作为HTML5元素和'fontface'作为CSS3属性

Modernizr.load({
test: Modernizr.fontface && Modernizr.canvas, // Test if the browser supports it or not
yep : '/path-to/html5-css3-attributes.css',  // If browser supports it, load this file
nope: '/path-to/old-css-attributes.css' // If NOT, load this instead
});

您也可以在文件路径条件中使用 .js。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2011-10-16
    • 1970-01-01
    • 2012-01-06
    • 2012-09-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多