接上一篇，我們繼續學習...

十一、IE和HTML5(Internet Explorer and HTML5)

不幸的是，討厭的IE瀏覽器需要動點小手術才能理解新的HTML5元素。

所有元素，默認的，都有個inline的display

為了確保所有新的HTML5元素能以block水平的元素正確地渲染，有必要對其做如下定義：

header, footer, article, section, nav, menu, hgroup {

display: block;

}

不幸的是，IE仍舊忽略這些樣式，因為它不知道這些標簽從哪里來的，好比是header元素。為了更簡單將此應用到每個新的應用過程中，雷米夏普(Remy Sharp)創建了一個腳本，通常稱為HTML5 shiv。該腳本同樣修復了些顯示問題。

<!--[if IE]>

<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>

<![endif]-->

十二、文檔某一部分的信息(hgroup)

想象一下，在我的網站的標題，我有我的站點的名稱，隨后立即由一個副標題。雖然我們可以使用一個<h1>和<h2>標簽，為其分別創造標記，但是依舊沒有（因為HTML4）一個簡單的方法來語義上說明了兩者之間的關系。此外，一個h2標記的使用提出了更多的問題，在層次結構上，當涉及到其他網頁上顯示的標題時。通過使用不影響文檔的大綱流hgroup元素，我們可以將這些標題組合在一起。

<header>

<hgroup>

<h1> Recall Fan Page </h1>

<h2> Only for people who want the memory of a lifetime. </h2>

</hgroup>

</header>

十三、必要的屬性(Required Attribute )

表單允許新的必要屬性，用來指定是否需要特殊的input。這取決于你的代碼偏好，你可以以下面兩種方式之一申明此屬性。

<input type="text" name="someInput" required>

或者，使用更結構化的方法：

<input type="text" name="someInput" required="required">

兩種方法都行。

下面是一個簡單的例子，我們還將添加占位符屬性，因為沒有理由不這樣做。

<form action="" method="get">

<label for="name">姓名:</label>

<input id="name" name="name" type="text" placeholder="zhangxinxu" required="required" />

<button type="submit">提交</button>

</form>

十四、Autofocus屬性

同樣，HTML5的解決方案消除了對JavaScript的需要。如果一個特定的輸入應該是“選擇”，或有重點的，默認情況下，我們現在可以利用自動獲取焦點屬性。

<input type="text" name="someInput" placeholder="zhangxinxu" required autofocus>

有趣的是，雖然我個人更傾向于喜歡XHTML的方法（用引號，等等），寫作“autofocus=autofocus”讓人感到有點怪。因此，我們將堅持使用單一關鍵字的方法。

十五、Audio支持

我們無需再依賴第三方插件區渲染音頻。HTML5提供了<audio>元素，嗯，至少，最終，我們將不必擔心這些插件。就目前，只有最近期的的瀏覽器提供HTML5音頻支持。在這個時候，它仍然是一個很好的做法提供一些向后兼容的形式。

<audio autoplay="autoplay" controls="controls">

<source src="file.ogg" />

<source src="file.mp3" />

<a href="file.mp3">Download this file.</a>

</audio>

來自張鑫旭-鑫空間-鑫生活[http://www.zhangxinxu.com]

總結

以上是生活随笔為你收集整理的HTML5新特征、窍门和技术（11~15）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。