Question

我完全陷入了一个非常奇怪的IE漏洞，而关于这个问题的其他帖子似乎没有解决它。 IE 8没有将CSS样式应用于我刚刚推出的网站上的HTML5标签。在过去，我总是使用shiv和/或代码来修复它：

<!--[if lt IE 9]>
 <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
 <script>
    document.createElement('header');
    document.createElement('nav');
    document.createElement('section');
    document.createElement('article');
    document.createElement('aside');
    document.createElement('footer');
 </script>
<![endif]-->

该网站为http://www.unyouth.org.au/。

IE8似乎识别出标题但是一旦它到达ASIDE的行就停止工作。

有没有人知道为什么会这样？任何帮助都会很棒。

非常感谢！

Answer 1

刚想出来，谢谢@ Sparky672指出我正确的方向。

对于遇到此问题的其他人，使用SVG创建了彩色分片正下方的曲线。我的印象是，如果IE无法渲染SVG，它会忽略它，但它似乎正在破坏它下面的所有东西。

我还没有找到如何删除IE 8 for IE 8，因为用IE条件语注释它似乎不起作用 - 但这是另一个问题。删除它可以修复样式问题！

Answer 2

我有一个修复，如果评论，请将你的内联SVG包装在IE9中。

<!--[if gte IE 9]><!-->

    <svg id="svg-source" height="0" version="1.1" 
      xmlns="http://www.w3.org/2000/svg" style="position:absolute; margin-left: -100%" 
      xmlns:xlink="http://www.w3.org/1999/xlink">

    </svg>

<!--<![endif]-->

Answer 3

资源管理器绝对讨厌无效的HTML。

Your invalid HTML包含重复的id个。具体而言，#site和<header>都使用了<footer>。有些浏览器只是第一次出现而忽略其余的。

第440行，第18栏：重复的ID网站。 <footer id="site">

第97行，第19列：第一次出现的ID网站就在这里。 <header id="site">

Answer 4

解决SVG删除问题（确保您拥有有效的HTML后） - 将以下代码应用到页面顶部以替换标准<html>。

<!--[if lt IE 9]> <html class="lt-ie9"> <![endif]-->
<!--[if gt IE 9]><!--> <html> <!--<![endif]-->

这将适用于＆＃34; lt-ie9＆＃34; IE版本低于版本9的整个页面。任何版本，9或更高版本，将显示正常的＆lt; html＆gt;没有上课。

此时，您有一个可以在CSS中使用的类来删除这些浏览器的任何元素。

.lt-ie9 svg {display: none;} /* this will remove all SVG elements with the class */

*免责声明：自从我在IE8上试过这个以来已经有一段时间了。它可能只有在你将SVG包装在 div.lt-ie9 中并将其应用于父级时才有效 - 我无法记住抛出的错误。我测试了它，但是我在Ubuntu上并且在这台机器上没有VM。*

注意：在您的父元素中使用条件IE注释的方法 - ＆lt; html＆gt; 或 ＆lt; body＆gt; - 很常见，有很多变种。您应该在该领域进行一些研究，并使用比此处提供的更一般的案例。这将为您提供此技术的更广泛的好处，并具体解决这个问题。

IE8无法识别HTML5（即使是shiv）

4 个答案: