IE没有样式化HTML5标签(带shiv)

Question

我正在尝试设计a <header>并且它在IE中不起作用.我正在使用Modernizr,但我已经尝试了shiv.

示例代码

<section>
  <header>
    <h1>Title</h1>
  </header>
  <p>Body</p>
</section>

风格:

section {
    border: 2px dotted black;
    padding: 0.25em;
}

header h1 {
    background-color: #ccc;
    text-align: center;
    margin: 0;
}

我希望在标题和部分内容周围有一个边框,但是只有一个'['看起来边框,标题在它下面.

什么出错了？

Answer 1

使用IE,即使使用shiv,也需要将HTML 5元素声明为块元素.我将此行用于Internet Explorer,但您可以根据需要修改它.

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

来自Modernizr文档:

您可能还想将许多这些元素设置为 display:block;

Answer 2

这取决于你试图对元素施加什么样的风格.正如James Long之前提到的那样,自定义元素是inline默认的.对于IE8,您还可以通过添加为元素添加边框display: inline-block;.