5個酷炫、實用的HTML標籤和屬性介紹

其實這也是標題黨了，也不能說是炫，只是由於我孤陋寡聞沒見過這些標籤。這些功能在通常的網站上也不是很常見，所以我感覺很新鮮。那麼就出一個系列吧，把我遇到的很好的HTML標籤都記錄下來（可能是HTML5的標籤，不保證所有瀏覽器都能兼容）。

這是HTML5新增的標籤，可以使一個區域的內容可以試試編輯，比如下面的表格：（在IE中的table似乎不支持這個屬性，但是div和body好像是支持的。如果你使用IE，那麼請嘗試點擊$100和$50的部分進行編輯，我在這兩個格子中加了contenteditable的標籤。如果你不是IE，那所有的內容應該都可以編輯）

<table contenteditable="true"><caption>Monthly savings</caption><tbody><tr><th>Month</th><th>Savings</th></tr><tr><td>January</td><td><div contenteditable="true">$100</div></td></tr><tr><td>February</td><td><div contenteditable="true">$50</div></td></tr></tbody></table>

注意這個表格是直接可以編輯的，我們不需要增加任何文本框就可以直接改文字，而且子標籤如果沒有指定這個屬性的話默認是繼承的，所以非常方便。 （當然如果在body中增加這個屬性那麼所有的東西都可以編輯，真可怕……）

這個東西就相當於.NET裡面的GroupBox，只是我原來不知道而已,它的作用是可將表單內的相關元素分組,：

<fieldset><legend>Index:</legend><ul><li><a href="#">Index of all articles</a></li><li><a href="#">Things sheeple need to wake up for today</a></li><li><a href="#">Sheeple we have managed to wake</a></li></ul></fieldset>

<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0<input type="range" id="a" value="50">100+<input type="number" id="b" value="50">=<output name="x" for="ab"></output></form></p><p><p><strong>Note:</strong> The output tag is not supported in Internet Explorer.</p></form>

<p>Do not forget to buy <mark>milk</mark> today.</p>

提示：您可以先修改部分代碼再運行

今天先到這吧，以後看到好的HTML標籤和特效再貼上來。