首頁  >  文章  >  web前端  >  html5新增的屬性和廢除的屬性簡要概述_html5教程技巧

html5新增的屬性和廢除的屬性簡要概述_html5教程技巧

WBOY
WBOY原創
2016-05-16 15:49:461259瀏覽

HTML5中,在新增加和廢除許多元素的同時,也增加和廢除了許多屬性。

新增的屬性

1、表單相關的屬性

對input(type=text)、select、textarea與button指定autofocus屬性。它以指定屬性的方式讓元素在畫面開啟時自動獲得焦點。 對input(type=text)、textarea指定placeholder屬性,它會對使用者的輸入進行提示,提示使用者可以輸入的內容。 對input、output、select、textarea、button與fieldset指定form屬性。它聲明屬於哪個表單,然後將其放置在頁面的任何位置,而不失表單之內。 對input(type=text)、textarea指定required屬性。此屬性表示使用者提交時進行檢查,檢查該元素內必定要有輸入內容。 為input標籤增加幾個新的屬性:autocomplete、min、max、multiple、pattern與step。還有list屬性與datalist元素配合使用;datalist元素與autocomplete屬性搭配使用。 multiple屬性允許上傳時一次上傳多個檔案; pattern屬性用於驗證輸入欄位的模式,其實就是正規表示式。 step 屬性規定輸入欄位的合法數字間隔(假如step="3",則合法數字應該是-3、0、3、6,以此類推),step 屬性可以與max 以及min 屬性配合使用,以創建合法值的範圍。 為input、button元素增加formaction、formenctype、formmethod、formnovalidate與formtarget屬性。使用者重載form元素的action、enctype、method、novalidate與target屬性。為fieldset元素增加disabled屬性,可以把它的子元素設為disabled狀態。 為input、button、form增加novalidate屬性,可以取消提交時進行的相關檢查,表單可以無條件地提交。

2、連結相關屬性

為a、area增加media屬性。規定目標 URL 是為什麼類型的媒介/裝置進行最佳化的。此屬性用於規定目標 URL 是為特殊裝置(例如 iPhone)、語音或列印媒介設計的。該屬性可接受多個值。只能在 href 屬性存在時使用。 為area增加herflang和rel屬性。 hreflang 屬性規定在被連結文件中的文字的語言。只有當設定了 href 屬性時,才能使用該屬性。註:此屬性是純諮詢性的。 rel 屬性規定目前文件與被連結文件/資源之間的關係。只有當使用 href 屬性時,才能使用 rel 屬性。 為link增加size屬性。 sizes 屬性規定被連結資源的尺寸。只有當被連結資源是圖示時 (rel="icon"),才能使用該屬性。該屬性可接受多個值。值以空格分隔。 為base元素增加target屬性,主要是保持與a元素的一致性。

3、其他屬性

為ol增加reversed屬性,它指定清單倒序顯示。 為meta增加charset屬性 為menu增加type和label屬性。 label為選單定義一個課件的標註,type屬性讓才當可以以上下文選單、工具列與列表cande但三種形式出現。 為style增加scoped屬性。它允許我們為文件的指定部分定義樣式,而不是整個文件。如果使用 "scoped" 屬性,那麼所規定的樣式只能套用到 style 元素的父元素及其子元素。 為script增減屬性,它定義腳本是否非同步執行。 async 屬性僅適用於外部腳本(只有在使用src 屬性時)有多種執行外部腳本的方法: 如果async="async":腳本相對於頁面的其餘部分異步地執行(當頁面繼續進行解析時,腳本將被執行) 如果不使用async 且defer="defer":腳本將在頁面完成解析時執行如果既不使用async 也不使用defer:在瀏覽器繼續解析頁面之前,立即讀取並執行腳本為html元素增加manifest,開發離線web應用程式時他與API結合使用,定義一個URL,在這個URL上描述文件的快取資訊。 為iframe增加撒個屬性,sandbox、seamless、srcdoc。用來提高頁面安全性,防止不信任的web頁面執行某些操作。

廢除的屬性

HTML4中某些屬性在HTML5中不再被使用,而是採用其他屬性或其他方式來取代。

在HTML 4中使用的屬性 使用該屬性的元素 在HTML 5中的替代方案
rev link、a rel
charset link、a 在被連結的資源的中使用HTTP Content-type頭元素
shape、coords a 使用area元素代替a元素
longdesc img、iframe 使用a元素連結到校長描述
target link 多餘屬性,被省略
nohref area 多餘屬性,被省略
profile head 多餘屬性,被省略
version html 多餘屬性,被省略
name img id
scheme meta 只為某個表單域使用scheme
archive、chlassid、codebose、codetype、declare、standby object 使用data與typc屬性類別呼叫插件。需要使用這些屬性來設定參數時,使用param屬性
valuetype、type param 使用name與value屬性,不宣告之的MIME型別
axis、abbr td、th 使用以明確簡潔的文字開頭、後跟詳述文字的形式。可以對更詳細內容使用title屬性,來讓儲存格的內容變得簡短
scope td 在被連結的資源的中使用HTTP Content-type頭元素
align caption、input、legend、div、h1、h2、h3、h4、h5、h6、p 使用CSS樣式表替代
alink、link、text、vlink、background、bgcolor body 使用CSS樣式表替代
align、bgcolor、border、cellpadding、cellspacing、frame、rules、width table 使用CSS樣式表替代
align、char、charoff、height、nowrap、valign tbody、thead、tfoot 使用CSS樣式表替代
align、bgcolor、char、charoff、height、nowrap、valign、width td、th 使用CSS樣式表替代
align、bgcolor、char、charoff、valign tr 使用CSS樣式表替代
align、char、charoff、valign、width col、colgroup 使用CSS樣式表替代
align、border、hspace、vspace object 使用CSS樣式表替代
clear br 使用CSS樣式表替代
compace、type ol、ul、li 使用CSS樣式表替代
compace dl 使用CSS樣式表替代
compace menu 使用CSS樣式表替代
width pre 使用CSS樣式表替代
align、hspace、vspace img 使用CSS樣式表替代
align、noshade、size、width hr 使用CSS樣式表替代
align、frameborder、scrolling、marginheight、marginwidth iframe 使用CSS樣式表替代
autosubmit menu  
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn