Question

所以我遇到了HTML5分区元素的问题。似乎我必须创建容器，否则它们不会阻塞级别。我确实添加了CSS重置，所以我不知道是否会导致它。不确定我是否应该填写完整的代码。我想确保它没有我不需要的额外代码。

无论如何这里是html5的一部分：

<div class="wrapper"><nav><ul>
<li><a href="#">About</a></li>
<li><a href="#">Gallery</a></li>
<li><a href="#">Content</a></li>
</ul>
</nav>
</div>

如果我没有那个包装器，无论出于何种原因，它都不会像块引用一样对待它。

Answer 1

支持HTML5语义元素的浏览器的最小版本：IE 9，Firefox 4，Chrome 8，Safari 5，Opera 11.1，Safari iOS 4，Android 2.1。

如果您使用的是较旧的浏览器版本，则浏览器会将所有无法识别的元素构建为内联元素。要解决此问题，您只需向CSS添加新规则：

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

此CSS规则对识别HTML5的浏览器没有负面影响，因为属性＆＃39;显示＆＃39;已经设置为＆＃39;阻止＆＃39;。

旧版本的IE（＆lt; 9）有另一个问题。他们拒绝将CSS规则格式应用于他们无法识别的元素。解决它：

<script>
    document.createElement('article');
    document.createElement('aside');
    ...
    document.createElement('section');        
</script>

或者，如果您不想为所有元素编写代码，可以使用以下脚本：html5shiv.js。此外，您会对以下内容感兴趣：Modernizr

html5分区元素的问题

1 个答案: