当我应用HTML5 shiv时,为什么我的HTML5标签不能在IE8中设置样式?

时间:2014-04-04 12:14:32

标签: html5 css3 internet-explorer-8

我遇到了IE8和HTML5的问题。尽管使用HTML Shiv,它似乎还没有解决。

除了IE8和IE之外,基本上该网站在所有浏览器上都能正常呈现。降低。在IE8或更低版本中,标签只是关闭,根本没有应用任何样式,我觉得标签没有被识别。然而,随着html5 shiv应用,我无法理解为什么它不起作用。

(P.S。是的,我知道有类似的问题已被提出。但是我们已经应用了HTML5 JS这些问题。)

HTML是:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!--[if lt IE 9]>
         <script type="text/javascript" src="_resources/js/iehtml5.js"></script>
<![endif]-->
<link rel="stylesheet" href="_resources/css/common.css" />
<script type="text/javascript" src="//use.typekit.net/yff7tzw.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body>
<!-- Page Header Section -->    
<header>
    <img src="_resources/files/logo.gif" alt="" />
</header>
<!-- Body Section -->
<main>
    <section>
        <h1></h1>
        <p></p>
    </section>

    <section>
        <h1></h1>
        <p></p>
    </section>

</main>
<!-- Footer Section -->
<footer>
    <h1></h1>
  <p></p>
</footer>
</body>
</html>

CSS

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

body {
    width: 100%;
    margin: 0px;
    padding: 0px;
    background-color: #fff;
}

main {
    margin-left: auto;
    margin-right: auto;
    width: 67.5em;
    background-color: #000;
    padding: 1em;
}

h1 {
    font-family: "museo-sans",sans-serif;
    font-weight:700;
    color:#67862d;
    text-align:center;
    padding-left:8em;
    padding-right:8em;
}

h2 {
    font-family: "museo-sans",sans-serif;
    font-weight:700;
    color:#67862d;
    text-align:center;
    padding-left:8em;
    padding-right:8em;
}

header  {
    margin-left:auto;
    margin-right:auto;
    width:69.5em;

}

header img  {
    margin-left:auto;
    margin-right:auto;
    padding:1.5em;
    display:block;
}

section  {
    margin-left:auto;
    margin-right:auto;
    width:67.5em;
    background-color:#000;
}

section p {
    font-family: "museo-sans",sans-serif;
    font-weight:100;
    color:#FFFFFF;
    text-align:center;
    padding-left:8em;
    padding-right:8em;
}

section iframe {
    width:44.6em;
    height:22.8em;
}

footer {
    margin-left:auto;
    margin-right:auto;
    width:69.5em;
    height:21.75em;
    text-align:center;
    background-color:#3d3d3c;
}

footer p {
    font-family: "museo-sans",sans-serif;
    font-weight:700;
    font-size:1.2em;
    color:#67862d;
    text-align:center;
    padding-left:8em;
    padding-right:8em;
    margin-bottom:-0.8em;
}

    footer span {
    font-family: "museo-sans",sans-serif;
    font-weight:700;
    color:#ffffff;
    text-align:center;
}

footer img { padding-top:1.5em; }

footer h1 {
    font-size:1.6em;
    margin-bottom:-0.4em;
}

footer h2 {
    font-family: "museo-sans",sans-serif;
    font-weight:700;
    color:#67862d;
    text-align:center;
}

1 个答案:

答案 0 :(得分:1)

根据您的安全设置,Internet Explorer不会在本地文件中执行JavaScript。例外是Mark of the Web

的文件

您可以使用以下设置更改此行为: Allow active content to run in files on My Computer

如果Internet Explorer具有更严格的设置,则可能不允许在任何网站上使用JavaScript。如果是这种情况,您可以enable JavaScript in Internet Explorer使用这些说明。