1

我在使用modernizr 脚本时遇到了一个烦人的问题。该脚本应该使 Internet Explorer 能够为新的 HTML 5 标记设置样式，但在我的代码中，标头标记已设置样式，但文章标记未设置。如果我使用 ID 为“article”的 DIV 并应用样式，它们是可见的，所以似乎modernizr 不适用于文章标签？我正在使用 IE 8 来测试它。

<!DOCTYPE html>
<meta charset="utf-8"/>
<html class="no-js">
<head>
    <title>Title</title>
    <script src="~Scripts/modernizr-1.7.min.js" type="text/javascript"></script>
    <style>
    header,footer,nav,section {display: block;}
    article, #article {border:1px solid red;}
    header {height: 95px;border-bottom: 8px solid #6b6b6d;}
    </style>
</head>

<body>

<div class="page">

    <header>
        LOGO | Title
    </header>

    <article>
        <h2>article element</h2>
    </article>

    <nav>
        <ul id="menu">
            <li>Link 1</li>
            <li>Link 2</li>
        </ul>
    </nav>

    <div id="article">
        <h2>div with id article</h2>
    </div>

</div>

<footer>
    footertext
</footer>

4

2 回答 2

4

添加article { display: block; }到您的 CSS。您可以将 CSS 的第一行更改为：

header, footer, nav, section, article { display: block; }

这将解决问题。

于 2011-05-06T09:42:58.427 回答
-4

我认为您使用了错误的库。

“Modernizr 不会向浏览器添加缺失的功能；相反，它会检测功能的本机可用性，并为您提供一种方法来保持对您的站点的精细控制，而不管浏览器的功能如何。” http://www.modernizr.com/

如果您对使用 Modernizr可以做什么感兴趣，ALA 有一篇关于如何有效使用它的清晰文章：http ://www.alistapart.com/articles/taking-advantage-of-html5-and-css3-with -modernizr/

请阅读其他问题的最佳答案：HTML5shiv vs Dean Edwards IE7-js vs Modernizr - 选择哪个？

我认为html5shiv库可能更适合您的问题。

于 2011-05-06T08:50:24.073 回答