Question

问题

html5shiv 如何使用 IE9 ，当使用[if lt IE 9]的条件注释用于 IE8 且在＆ Safari 4.x 和 Firefox 3.x 阅读 IE   条件评论？如果没有，那么 html5shiv 如何能够使用Github Instructions中建议的条件评论在这些浏览器上工作？

有question here询问是否可以在没有条件评论的每个浏览器中使用它以及副作用会是什么，但这不是我的问题。 4年前问过这个问题。 HTML5现在已成为标准配置，Microsoft不再提供对旧版浏览器的支持，因此在每个浏览器中加载它都会让人感到疯狂，我不会考虑这一点。我的问题与Github上的文档有关，html5shiv使用该文档开箱即用，以及如何使用它来支持它声称支持的浏览器。

在github上引用关于html5shiv脚本的自述文件：

“它还为IE6-9，Safari 4.x和FF 3.x的HTML5元素应用基本样式。”

用途：

<!--[if lt IE 9]>
    <script src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->

根据Stat Counter，在过去的一年中，IE 8和9的总和已从全球使用率的4％左右下降到约2％。自1月12日微软dropped support用于传统浏览器以来，html5shiv似乎现在或将很快成为过去。看看这些传统的IE浏览器在未来一年中会下降多少将会很有趣。

但是，根据您正在开发的内容，您可能仍希望支持这些浏览器。当您在上述统计数据中包含Safari 4.x和Firefox 3时，html5shiv支持的浏览器共享总量为2.3％。对于大多数人来说什么都不是，但如果你拥有一个电子商务网站，2.3％可能是巨大的。

关于我的实际问题，我认为我要么忽略了文档中的某些内容，要么对IE条件评论不够了解。

从逻辑上讲，我认为这是最好的方法。 IE中的条件注释通过版本5到9工作，因此我们不应该无理由地在IE5中加载脚本。

<!--[if !(IE 5)]>
    <script src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->

然而，在过去的5年里，我从来没有见过有人这样做，所以我显然错过了一些东西。另外，我仍然没有看到这对FF 3和Safari 4有什么用，除非有一个错误或什么导致他们不阅读评论。我打开了这个topic on html5shiv github regarding this issue as well，但未能得到答案。

HTML5shiv很容易在数百万个网站上使用，大多数开发者和网站所有者认为它支持开箱即用的IE9 Safari 4和FF 3.

Also, as far as I'm aware in regards to IE9, this is all that html5shiv does to support it.

article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}
mark{background:#FF0;color:#000}

如果这是真的，可能是许多人停止使用它的另一个原因，考虑到当你把它拿出来并将它包含在你的css（或css重置）中时，你可以降到 1.39％< / strong> html5shiv 的浏览器实际上会对其产生影响。

Answer 1

shiv脚本仅在IE中使用（在这种情况下小于版本9 [... lt IE9 ...]），不在其他浏览器中使用，被它们忽略。它毕竟已经注释掉了

<!-- ... -->

IE支持这些并读取它们。 shiv脚本增强了功能，使这些旧浏览器能够“更好”地工作。

更新：看起来“lt IE9”也在Safari 4.x和FF 3.x中运行。从我能找到的（全部克隆自GitHub项目描述）。

另一个更新：我有信心这只适用于IE，而不是旧的Safari或FireFox。我会继续挖掘。如果我错了，别人会纠正我。

Answer 2

附注：您应该只将浏览器统计信息作为非常宽松指南。这些网站上的统计数据远非福音，并且将从一个国家变为另一个国家，从市场变为市场，从人口统计变为人口统计。您应该查看自己网站的分析，看看有多少用户属于Safari 4，FireFox 3，Internet Explorer 6-8类别（我的猜测是，它将低于2.3％）。

（另请记住，FireFox会自动更新并且当前使用的是版本43（！），并且Safari会自动使用OSX进行更新，并且版本为9.使用旧版本的人的可能性非常小。我查了一下一个非常受欢迎的我的分析网站：在过去一个月的20,000次会议中，只有1次使用FF3,1次使用IE7,1次使用IE8，没有使用Safari 4或IE6。）

然而，如果你热衷于针对这些异常值，那么这就是你问题的答案：

当使用[if lt IE 9]的条件注释用于IE8及以下时，html5shiv如何在IE9上工作

HTML5shiv不适用于IE9，因为它不需要。 Internet Explorer 9已经正确支持几乎所有HTML5元素：

Safari 4.x和Firefox 3.x阅读IE条件评论吗？

Safari和FireFox不支持IE条件注释，但它们的定位方式如下：

FF3：

/* FireFox 3 */
html>/**/body .selector, x:-moz-any-link, x:default { color: lime; }

Safari浏览器：

/* Safari only override */     
::i-block-chrome,.myClass {      color: lime;     }

但这不是HTML5shiv所做的，而你是对的： HTML5shiv主页上显示的条件语句不将被当前的FF3或Safari 4选中州。我猜这是因为他们认为这些浏览器非常罕见，对普通用户来说不值得。此外，任何CSS重置/规范化都可能包括那些浏览器所需的CSS。

所以要了解如何处理所有浏览器中提到的HTML5元素：

IE6-8 ：按照Github documentation中所述使用HTML5shiv.js。

IE9-11 ：使用Normalize.css或将main { display: block }添加到您的HTML中。（感谢LGSon。）

Safari 4 ：使用Normalize.css或以下CSS：

article, aside, details, figcaption, figure, main,
footer, header, hgroup, menu, nav, section {
    display: block;
}

FireFox 3 ：与上述相同。

（FireFox 4+和Safari 5+具有更强大的HTML5支持，不需要上述CSS。）

Answer 3

我写了一篇非常详细的页面致力于Internet Explorer Conditional Comments年前。这是针对 lte =小于[或]等于 IE9;我已经在我写的页面上记录了许多准备复制和粘贴的例子。

<head>
<!--[if lte IE 9]>
<script src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->
</head>

我建议您的访问者从Vista升级，这是唯一可以在安全支持下运行IE9或更低版本的Windows版本。截至2016年1月，仅支持每个Windows版本的最新版Internet Explorer。请参阅Internet Explorer Versions Wiki page，了解哪些版本的IE在哪个版本的Windows上运行。

截至2010年1月，只有IE10 +应该给予任何有意义的关注。适当的策略是整页阻止IE9或更低;如果微软不支持它，那么你不应该，除非你得到的最少两次你在一年的公司工作。站在你的地面开发者身边，我们是那些最终知道如何完成工作的人。

Answer 4

不，github页面上的示例如何加载shiv，除了8及以下的IE浏览器之外，不会使用"downlevel-hidden" conditional comment技术。

要使它在IE9及以下版本以及Safari和Firefox等非IE浏览器上运行，需要使用"downlevel-revealed" conditional comment技术，如下所示。

<!--[if lte IE 9]><!-->
<link href="ie98765_and_non_ie.css" rel="stylesheet">
<!--<![endif]-->

值得注意的一点是：

IE10及更高版本不再支持条件注释，在此用例中将表现为非IE浏览器。
在已经支持HTML5元素的浏览器上，shiv什么都不做。

Answer 5

回答我自己的问题......

html5shiv的github文档具有误导性......这就是它。在进一步挖掘之后，我遇到了this old HTML5SHIV Github issue that answers this question。

没有任何“浏览器怪癖或黑客”导致在Firefox 3或Safari 4（here's a very extensive list of awesome browser hacks）中读取条件注释。

[if lt IE 9]在IE 5-8中工作，应该如何...不要被自述文件所迷惑。

所以要明确你是否正在使用下面的代码片段，希望它能够神奇地用于IE9，Safari 3或Firefox 4，你运气不好。

<!--[if lt IE 9]>
    <script src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->

那么应该如何使用html5shiv？

正如我在问题中提到的和其他人在他们的回答中提到的那样，微软在2016年1月12日放弃了对旧版浏览器的支持。牢记这一点并且我的问题中提到的这些统计数据可能会有所偏差，我的猜测是legacy useage将在明年左右继续以稳健的速度下降。最重要的是，目前的大部分用途可能来自slow to update的老企业。对于大多数人来说，这些用户并不是从他们那里获得流量（特别是因为那些计算机很可能只能用于计算机）。

就我个人而言，我不会再使用html5shiv，但这既不是在这里也不是在那里。由于有很多人可能仍会使用HTML5，这是基于个人经验，研究以及HTML5shiv如何支持不同浏览器的其他个人经验，研究和其他答案的建议......

如果您想要使用html5shiv支持IE6-9，Safari 4和Firefox 3而不做任何其他更改，请不要包含条件注释：

<script src="bower_components/html5shiv/dist/html5shiv.js"></script>

如果您想要支持Internet Explorer，请使用此功能。由于html5shiv不能在IE 5上运行，所以在那个糟糕的浏览器中加载它是没有意义的：

<!--[if !(IE 5)]>
       <script src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->

如果您只需要支持Internet Explorer 8或9，请使用此功能：

<!--[if (IE 8)|(IE 9)]>
       <script src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->

选项4：虽然上述方法可能是您所需要的，但经过一番思考后，我认为这是使用该脚本的最有效方式。 < / p>

<style type="text/css">
    article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}
    mark{background:#FF0;color:#000}
</style>
<!--[if (gt IE 5)&(lt IE 9)]>
    <script type="text/javascript">window.html5={shivCSS:!1};</script>
    <script type="text/javascript" src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->

选项4 1/2：“可能”是继续使用HTML5Shiv的最佳方式：

甚至比上面更好，我们可以删除类型属性，因为我们指定这是HTML5，我们可以缩小它。我们也可以使用像jsdeliver或maxcdn这样的流行cdn来尝试加快速度，因为希望他们已经将文件缓存在他们的计算机上。不要，我重申不要使用谷歌来托管html5shiv。这是人们常犯的错误，只能缓存几分钟。 Google代码并不是CDN。

我们也禁用了shiv css并自己包含它。如果您使用css reset (here's a list of the most popular in 2016)，则可以将样式部分放在一起。

最后我们按照推荐的方式将它包含在关闭头标记之前。

<!DOCTYPE html>
<html>
  <head>
    <!-- Meta, stylesheets, etc... -->
    <style>article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}</style>
    <!--[if (gt IE 5)&(lt IE 9)]> <script>window.html5={shivCSS:!1};</script> <script src="https://cdn.jsdelivr.net/html5shiv/3.7.3/html5shiv.min.js"></script> <![endif]-->
</head>

此方法可确保您从HTML5shiv获得所需的结果，支持您期望的浏览器。

由于IE和Firefox中不再支持旧版浏览器，而且Safari有自动更新功能，因此很可能您不再使用shiv并使用@ LGSon的解决方案或只是CSS样式/重置。

如何正确使用HTML5shiv ...如何在IE 9，Firefox，Safari上工作？

问题

5 个答案:

html5shiv的github文档具有误导性......这就是它。在进一步挖掘之后，我遇到了this old HTML5SHIV Github issue that answers this question。

那么应该如何使用html5shiv？