28個HTML5特征、竅門和技術

發布時間:2017-04-12 09:12 來源:互聯網 當前欄目:網頁設計教程

前端的發展如此之迅猛,一不留神,大俠你可能就會被遠遠地甩在后面了。如果你不想被HTML5的改變/更新攪得不知所措的話,可以把本文的內容作為必須了解的熱身課程。

一、新的Doctype
//zxx:”doctype”中文意思指“文檔類型”

仍在使用麻煩的,不可能記得住的XHTML文檔類型?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.html5cn.org/">如果是,為什么還在用呢?使用新的HTML5文檔類型代替吧。你會活得更久的——正如Douglas Quaid說的

<!DOCTYPE html>我就琢磨著,為了HTML5搞個這廝代碼,您可能會對這段代碼究竟靠不靠譜表示懷疑。不用擔心,如今這是可行的,只有老的瀏覽器需要一個 特定的doctype(文檔類型)。瀏覽器如果不知道doctype,就會很簡單的以標準模式對包含的標簽進行渲染。所以,妹妹你大膽的向前沖,把小心謹 慎都拋到九霄云外,去擁抱新的HTML5文檔類型吧。

二、圖形元素(The Figure Element )
看看下面給圖片添加的標示:

<img src="path/to/image" alt="About image" /> <p>Image of Mars. </p>文字裹在p標簽里,與img標簽各行其道,很難讓人聯想到這就是標題。HTML5通過采用<figure>元素對此進行 了改正。當合<figcaption>元素組合使用時,我們就可以語義化地聯想到這就是圖片相對應的標題

<figure> <img src="path/to/image" alt="About image" /> <figcaption> <p>This is an image of something interesting. </p> </figcaption> </figure>
三、<small>重新定義
還 在不久前,<small>元素被用來創建靠近logo且相關的副標題。這是個很有用的表現元素,但是,現在,這種用法可能就不正確 了。<small>元素已經被重新定義了,指小字,因而更具可用性。試想下你網站底部的版權狀態,根據對此元素新的HTML5定 義,<small>可以正確地包裹這些信息。

small元素專指“小字”。

四、腳本(scripts)和鏈接(links)無需type
您可能現在仍在給link和script標簽增加type屬性。

<link rel="stylesheet" href="path/to/stylesheet.css" type="text/css" /> <script type="text/javascript" src="path/to/script.js"></script>這已經是老黃花菜,非必需品了。這意味著,這些標簽都各自指向樣 式表和腳本。因此,我們可以把type屬性一起干掉。

<link rel="stylesheet" href="path/to/stylesheet.css" /> <script src="path/to/script.js"></script>

五、引號還是不要引號
…這確實是個問題。記住,HTML5不是XHTML,要是你不愿意,你沒有必要非得用引號標記包裹你的屬性,沒有必要非得閉合元素。換句話說,只要你自己覺得舒服,就沒有什么對錯之分。對于我自己來說就是如此。
<p id=someId> Start the reactor.對此取舍你還得自己拿主意。如果你更傾向于結構化的文檔,就算天塌下來,也要把引號牢牢拽在懷里。

六、內容可編輯
28個HTML5特征、竅門和技術  電腦高手


  • 1、
  • 2、
  • 3、
  • 4、
  • 5、
  • 6、
  • 7、
  • 8、
  • 9、
  • 10、
  • 11、
  • 12、
  • 13、
  • 14、
  • 15、
  • 16、
  • 17、
  • 18、
  • 19、
  • 20、
  • 21、
  • 22、
  • 23、
  • 24、
  • 25、
  • 1、
  • 2、
  • 3、
  • 4、
  • 5、
  • 6、
  • 7、
  • 8、
  • 9、
  • 10、
  • 11、
  • 12、
  • 13、
  • 14、
  • 15、
  • 16、
  • 17、
  • 18、
  • 19、
  • 20、
  • 21、
  • 22、
  • 23、
  • 24、
  • 25、