DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> HTML基礎知識 >> HTML5詳解 >> HTML5的初級技巧 之第一課
HTML5的初級技巧 之第一課
編輯:HTML5詳解     

Web技術的發展速度太快了,如果你不與時俱進,就會被淘汰。因此,為了應對即將到來的Html5,本文總結了22個Html5的初級技巧,希望能對你進一步學習好Html5會有所幫助。

1. 新的Doctype聲明

XHtml的聲明太長了,我相信很少會有前端開發人員能手寫出這個Doctype聲明。
 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHtml 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xHtml1-transitional.dtd">

Html5的Doctype聲明很短,看到這個聲明相信你馬上就能記住,不用浪費腦細胞去記那長的有點變態的XHtml的Doctype聲明了。

<!DOCTYPE Html>

Html5的簡短的DOCTYPE聲明是讓Firefox、Chrome等現代浏覽器和IE6/7/8等浏覽器都進入(准)標准模式,你可能會奇怪IE6/7居然也可以支持Html5 Doctype,事實上,IE是只要doctype符合 這種格式,都會進入標准模式。

2. <figure>標簽

看看下面一段簡單的代碼:
 

<img alt="About image" src="path/to/image"> 
<h6>image of Mars.</h6>

遺憾的是,這裡的h6標簽和img標簽好像沒有什麼關系,語義不夠明確。Html5意識到了這一點,於是就采用了<figure>標 簽。當<figure>結合<figcaption>標簽的使用,可以讓h6標簽和img標簽組合起來,代碼就更具語義化了。

<figure>
<img alt="about image" src="path/to/image"> 
<figcaption>
<h6>This is an image of something interesting. </h6>
</figcaption>
</figure> 

3. 重新定義<small>

不久前,我使用了<small>標簽來創建與logo相關的副標題。但是在Html5中重新定義了<small>標簽,使 之更能表現語義化,在<small>的字號都會變小,想想如果這個標簽用於網站的底部的版權信息還是個不錯的做法。

4. 去掉了Javascript和CSS標簽的type屬性

通常你會在<link>和<script>加上type屬性:

<link rel="stylesheet" type=text/css href="path/to/stylesheet.CSS">
 <script type="text/Javascript" src="path/to/script.JS"></script>

在Html5中,不再需要type屬性了,因為這顯得有點多余,去掉之後可以讓代碼更為簡潔。

<link href="path/to/stylesheet.CSS">
 <script src="path/to/script.JS"></script>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved