IE不造型HTML5標籤（與shiv）

我試圖設計一個<header>並且它在IE中不起作用。我正在使用Modernizr，但我已經嘗試過shiv。IE不造型HTML5標籤（與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; 
}

我希望周圍的頭和部分內容的邊界，而是存在僅僅是一個「[」找邊框和標題是下它。

怎麼回事？

來源

2011-07-06 Joe Flynn

@feela - 你確定*嗎？ Modernizr *不包括Shiv功能，它至少適用於IE8和IE7。（我們將它用於需要在IE7中工作的站點，並且很好）。有關更多信息，請參閱以下答案：http://stackoverflow.com/questions/3855294/html5shiv-vs-dean-edwards-ie7-js-vs-modernizr-which-to-choose/3855343#3855343 – Spudley

@feeela是不正確的。我們使用這個，它從IE7起作用。 –

@Spudley @Michael Irigoyen對不起，我認爲它爲時已晚。我自己回答了[不同的問題]（http://webmasters.stackexchange.com/questions/11729/whats-the-difference-between-modernizr-and-html5shiv/11740#11740）... – feeela

使用IE，即使使用shiv，也需要將HTML 5元素聲明爲塊元素。我對Internet Explorer使用此行，但您可以對其進行修改以獲取所需的元素。

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

從Modernizr Documentation：

你也可能會想很多這些元素的設置爲display:block;

來源

2011-07-06 20:51:12

這可能是答案。 – thirtydot

有時，自定義元素（這是我們如何說服IE使用HTML5標籤）默認爲inline。嘗試添加以下一塊CSS：

section, 
header { 
    display: block; 
}

來源

2011-07-06 20:51:23

這取決於您試圖對元素施加什麼風格。正如James Long在之前所說的那樣，自定義元素默認爲inline。對於IE8，您還可以通過添加display: inline-block;來爲元素添加邊框。

來源

2012-12-07 20:07:15

IE不造型HTML5標籤（與shiv）

回答

相關問題