- 精通HTML5+CSS3+JavaScript網頁設計(視頻教學版)(第2版)
- 王英英
- 498字
- 2019-12-09 14:23:50
1.4 HTML5語法的新變化
為了兼容各個不統一的頁面代碼,HTML5的設計在語法方面做了以下變化。
1.4.1 標簽不再區分大小寫
標簽不再區分大小寫是HTML5語法變化的重要體現,例如:
<!DOCTYPE html> <html> <head> <title>不再區別大小寫標簽</title> </head> <BODY> 人到情多情轉薄,而今真個不多情。 </body> </html>
在IE 11.0瀏覽器中預覽,效果如圖1-11所示。

圖1-11 網頁預覽效果
雖然“<BODY>人到情多情轉薄,而今真個不多情。</body>”中開始標記和結束標記不匹配,但是這完全符合HTML5的規范。用戶可以通過W3C提供的在線驗證頁面來測試上面的網頁,驗證網址為http://validator.w3.org/。
1.4.2 允許屬性值不使用引號
在HTML5中,屬性值不放在引號中也是正確的。例如以下代碼片段:
<input checked="a" type="checkbox"/> <input readonly type="text"/> <input disabled="a" type="text"/>
上述代碼片段與下面的代碼片段效果是一樣的:
<input checked=a type=checkbox/> <input readonly type=text/> <input disabled=a type=text/>
注意:雖然HTML5允許屬性值可以不使用引號,但是仍然建議讀者加上引號。因為如果某個屬性的屬性值中包含空格等容易引起混淆的屬性值,此時可能會引起瀏覽器的誤解。例如以下代碼:
<img src=ss ch01/1.1.jpg />
此時瀏覽器就會誤以為src屬性的值就是ss,這樣就無法解析路徑中的1.1.jpg圖片。如果想正確解析到圖片的位置,只有添加上引號。
1.4.3 允許部分屬性值的屬性省略
在HTML5中,部分標志性屬性的屬性值可以省略。例如,以下代碼是完全符合HTML5規則的:
<input checked type="checkbox"/> <input readonly type="text"/>
其中,checked="checked"省略為checked,而readonly="readonly"省略為readonly。
在HTML5中,可以省略屬性值的屬性如表1-3所示。
表1-3 可以省略屬性值的屬性

推薦閱讀
- 網站建設與網頁設計從入門到精通Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript
- Dreamweaver CS5網頁設計與制作教程
- Bootstrap響應式Web開發
- 網頁設計那些事兒
- Vue.js Web開發案例教程(在線實訓版)
- 網頁設計與網站建設從入門到精通
- HTML5+CSS3網頁制作基礎培訓教程
- 速學速通:快學Flash網頁動畫
- CSS圖鑒
- 人人都玩開心網:Ext JS+Android+SSH整合開發Web與移動SNS
- Linux系統與網絡服務管理技術大全(第二版)
- Vue應用程序開發
- Web綜合實戰教程
- Web程序設計
- Dreamweaver CS3網站制作炫例精講