內容類型 (ContentType)
首先, HTML 5的文件擴展符與內容類型保持不變。也就是說,擴展符仍然爲" .html" 或 ".htm" ,內容類型 (ContentType)仍然爲 "text刷html"
DOCTYPE聲明
DOCTYPE聲明是HTML文件中必不可少的,它位於文件第一行。在HTML5中,刻意不使用版本聲明,一份文檔將會適用於所有版本的HTML. HTML 5中DOCTYPE聲明方式是不區分大小寫,引號不區分是單引 號還是雙引號
指定字符編碼
HTML4中:;HTML 5中,可以使用對元素直接追加charset屬性的方式來指定字符編碼,如: 兩種方居都有效,不能同時使用。從HTML5開始,對於文件的字符編碼推薦使用UTF-8
新增的元素和廢除的元素
新增的結構元素
section:表示頁面中的一個內容區塊
article:表示頁面中的一塊與上下文不相關的強立內容
aside:表示article元素的內容之外的
header:表示頁面中一個內容區塊或整個頁面的標題
bgroup:用於對整個頁面或頁面中一個內容區塊的標題進行組合
footer:表示整個頁面或頁面中一個內容區塊的腳註;一般會包含創作者的姓名、創作日期以及創作者聯繫信息
nav:表示頁面中導航鏈接的部分
figure:表示一段獨立的流內容,一般表示文檔主體流內容中的一個獨立單元。使用figcaption元素爲figure元素組添加標題
新增的真他元素
video:定義視頻
audio:定義音頻
embed:用來插入各種多媒體,格式可以是Midi、Wav、AIFF、AU、MP3等
mark:主要用來在視覺上向用戶呈現那些需要突出顯示或高亮顯示的文字
progress:表示運行中的進程,可以用progress元素顯示JS中耗費時間的函數的進程
time:表示日期或時間,也可以同時表示兩者
ruby:表示ruby註釋(中文註音或字符)
rt:表示字符(中文註音或字符)的解釋或發音
rp:在ruby註釋中使用,以定義不支持ruby元素的瀏覽器所顯示的內容
wbr:表示轉換行。 wbr元素與br元素的區別是. br元素表示此處必須換行,而wbr的意思是瀏覽器窗口或父級元素的寬度足夠寬時(沒必要換行時),不進行換行,而當寬度不夠時主動在此處進行換行。 wbr對字符型的作用挺大,但對中文貌似沒多大用處
canvas:表示圖形,比如圖表和其他圖像。這個元素本身沒有行爲,僅提供一塊麪布,但它把一個繪圖API展現給客戶端JavaScript
command:表示命令按鈕, 比如單選按鈕、複選框或按鈕
details:表示用戶要求得到且可以得到的細節信息,它可以與summary元素配合使用。summary元素應該是details元素的第一個子元素
datalist:表示可選數據的列表,與input元素配合使用,可以製作出輸入值的下拉列表
datagrid:表示可選數據的列表,它以樹形列表的形式來顯示
keygen:表示生成密鑰
output:表示不同類型的輸出.比如腳本的輸出
source:爲媒介元素(比如
menu:表示菜單列表,當希望列出表單控件時使用核標籤
新增的input元素的類型
email:表示必須輸入E-maíl地址的文本輸入框
url:表示必須輸入URL地址的文本輸入框
number:表示必須輸入數值的文本輸入框
range:表示必須輸入一定範圍內數字值的文本輸入框
HTML5擁有多個可供選取日期和時間的新型輸入文本框:
date一一選取日、月、年
month一一選取月、年
week一一選取周和年
time一一選取時間(小時和分鐘)
datetime-一一選取時間、日、月、年 (UTC時間)
datetime-local一一選取時間、日、月、年(本地時間)
新增的屬性
表單相關的屬性
autofocus:以指定屬性的方式讓元素在畫面打開時自動獲得焦點
placeholder:提示用戶可以輸入的內容
form:聲明屬於哪個表單,然後將其放置在頁面上任何位置而不是表單之內
required:表示在用戶提交的時候進行檢查,檢查該元素內一定要有輸入內容爲input元素增加了幾個新的屬性:autocomplete、min、max、multiple、pattern、step。multiple屬性允許在上傳文件時一次上傳多個文件
formaction、formenctype、formmethod、formnovalidate與formtarget:可以重載form元素的action、enctype、method、novalidate與target屬性
novalidate:可以取消提交時進行的有關檢查,表單可以被無條件地提交
鏈接相關屬性
media:規定目標URL是什麼類型的媒介/設備進行優化的,只能在href屬性存在時使用
hreflang與rel:保持與a元素、link元素的一致
sizes:可以與icon元素結合使用(通過rel屬性),該屬性指定關聯圖標(icon元素)的大小
其他屬性
reversed:指定列表倒序顯示
charset:爲文擋的字符編碼的指定提供了一種比較良好的方式
type與label:label屬性爲菜單定義一個可見的標註,type屬性讓菜單以上下文菜單、工具條與列表菜單的三種形式出現
scoped:規定樣式的作用範圍,譬如只對頁面上某個樹起作用
async:定義腳本是否異步執行
manifest:開發離線Web應用程序時它與API結合使用定義一個URL,在這個URL上描述文擋的緩存信息
sandbox、seamless與srcdoc:用來提高頁面安全性,防止不信任的Web頁面執行某些操作
全局屬性
contentEditable屬性
contentEditable屬性:允許用戶編輯元素中的內容,是一個布爾值屬性,可以被指定爲true或false
該屬性還有個隱藏的inherit(繼承)狀態,屬性爲true時元素被指定爲允許編輯,屬性爲false時元素被指定爲不允許編輯;未指定true或false則由inherit狀態根據父元素來決定。
元素還具有一個isContentEditable屬性,當元素可編輯時該屬性爲true,當元素不可編輯時該屬性爲false
designMode屬性
designMode屬性:用來指定整個頁面是否可編輯
designMode屬性只能在JS腳本里被編輯修改;該屬性有兩個值"on"與"off"。屬性被指定爲 "on" 時頁面可編輯,被指定爲 "off" 時頁面不可編輯
hidden屬性
H5中所有的元素都允許使用hidden屬性,該屬性功能是通知瀏覽器不渲染該元素,使該元素處於不可見狀態。但是頁面裝載後允許使用JS腳本將該屬性取消,取消後 該元素變爲可見狀態,同時元素中的內容也即時顯示出來。Hidden屬性是一個布爾值的屬性,當設爲true時元素不可見,當設爲false肘元素可見
spellcheck屬性
spellcheck屬性是爲對用戶輸入的文本內容進行拼寫和語法檢查,具有true或false兩種值;但是它在書寫時必須明確聲明屬性值爲true或false。需要注意的是:如果元素的readOn]y或disabled設爲true,則不執行拼寫檢查
tabindex屬性
對窗口或頁面中所有控件進行遍歷時,每一個控件的tabindex表示該控件是第幾個被訪問到的。tabindex還有另外一個作用,把元素的tabindex值設爲負數. (通常爲-1)後,仍可以通過編程方式讓元素獲得焦點,但按下Tab鍵時該元素就不能獲得焦點了,這在複雜的頁面中或複雜的Web應用程序中是十分有用的