建站
咨詢
售后
建站咨詢
新聞中心
HTML5有哪些新的元素和屬性
HTML5 引入了新的 HTML 元素和屬性，有的是傳統(tǒng)通用元素的語義化版本，如取代 div 元素的 nav, footer
為南樂等地區(qū)用戶提供了全套網(wǎng)頁設(shè)計(jì)制作服務(wù)，及南樂網(wǎng)站建設(shè)行業(yè)解決方案。主營業(yè)務(wù)為網(wǎng)站設(shè)計(jì)制作、網(wǎng)站設(shè)計(jì)、南樂網(wǎng)站設(shè)計(jì)，以傳統(tǒng)方式定制建設(shè)網(wǎng)站，并提供域名空間備案等一條龍服務(wù)，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務(wù)。我們深信只要達(dá)到每一位用戶的要求，就會得到認(rèn)可，從而選擇與我們長期合作。這樣，我們也可以走得更遠(yuǎn)！
等元素，也有一些全新的元素，如 audio, video。一些在 HTML4 中不被推薦使用的元素，如 font 和 center
將被棄用。HTML5 引入的新 HTML 元素包括：
article：文章
aside：內(nèi)容旁邊的側(cè)邊欄內(nèi)容
audio：音頻
canvas：2D 繪圖
command：命令按鈕
datalist：下拉選擇框
details：對象的細(xì)節(jié)
dialog：對話框
embed：外部插件或?qū)ο?/p>
figure：一組媒體對象以及標(biāo)簽文字
footer：頁腳
header：頁首
hgroup：文檔某一部分的信息
keygen：表單生成的 Key
mark：標(biāo)注的文字
meter：預(yù)先定義的范圍內(nèi)的度量
nav：導(dǎo)航條
output：輸出
progress：進(jìn)度條
rp：標(biāo)識 rubby 內(nèi)容
rt：rubby 內(nèi)容的解釋
ruby：rubby 內(nèi)容
section：定義一個部分
source：媒體的資源
time：日期時間
video：視頻
html添加了哪些表單元素和屬性
html5 新增了的表單元素和屬性如下：
屬性：
1、 form屬性
在HTML5中表單元素可放在表單之外，通過給該元素添加form屬性即可。
2、 formaction屬性
HTML5給提交按鈕(如button、submit、image等)增加了formaction屬性，以便提交到不同的服務(wù)器地址
3、formmethod屬性
既然對提交按鈕有了formaction屬性，就相應(yīng)的有了formmethod屬性
4、 placeholder屬性
給文本框(text或textarea)處于未輸入狀態(tài)時的一種文字提示
5、autofocus屬性
自動獲得焦點(diǎn)，一個頁面只能有一個控件具有該屬性
6、 list屬性
HTML5為單行文本框增加了一個list屬性，該屬性的值為某個datalist元素的id，增加該屬性后的單行文本框類似選擇框(select)，但允許用戶自定義輸入，為了避免沒有支持該蒜素的瀏覽器出現(xiàn)錯誤，我們通常使用CSS設(shè)置不顯示
6、autocomplete屬性
自動完成允許瀏覽器預(yù)測對字段的輸入，在HTML5之前自動完成不能自定義設(shè)置，任何人都可以看到，所以存在安全隱患，在HTML5中可以通過此屬性來指定“on”、”off“或“”(不指定)三種，不指定時使用瀏覽器的默認(rèn)值，這取決于各瀏覽器的決定。
元素：
HTML5大幅度地增加和改良了input元素的種類
search 與text文本框類似，用于搜索；
tel 與text文本框類似，用于電話；
url 與text文本框類似，用于url格式的地址；
email 與text文本框類似，用于email格式的地址；
number 與text文本框類似，用于數(shù)值；
range 只允許輸入一段范圍內(nèi)的數(shù)值，通過min和max屬性來設(shè)置范圍；
color 顏色文本框，“#000000”格式的文字；
file 文件選擇文本框，HTML5中通過multiple屬性可以多選；
datetime、date、month、week、time、datetime-local 各種日期與時間輸入的文本框；
output 定義不同類型的輸出；
表單驗(yàn)證
自動驗(yàn)證
所謂自動驗(yàn)證，就是通過為元素添加相應(yīng)的屬性來達(dá)到驗(yàn)證的要求
1、 required屬性
具有該屬性的元素，如果其內(nèi)容為空則不允許提交，并給出相應(yīng)的提示
2、pattern屬性
具有該屬性的元素，如果內(nèi)容不為空則把內(nèi)容與pattern的值進(jìn)行正則匹配，匹配不成功則不通過并提示
3、min屬性和max屬性
它們是值類型和日期類型的input元素專用屬性，限制了輸入的范圍
4、 step屬性
控制元素的值增加或減少的步幅，如輸入11-100之間的數(shù)字，且步幅是5，那么只能輸入11、16、21....
顯示驗(yàn)證
除了給元素添加屬性來自動驗(yàn)證外，在HTML5中，form元素與輸入元素(input)包括select元素和textarea都具有一個checkValidity方法，調(diào)用該方法可以進(jìn)行手動驗(yàn)證，checkValidity方法以boolean的形式返回驗(yàn)證結(jié)果。
取消驗(yàn)證
取消表單驗(yàn)證有兩個屬性：用于form的novalidate和用于submit的formnovalidate：
自定義錯誤
在HTML5中沒經(jīng)過驗(yàn)證的表單瀏覽器會有默認(rèn)的提示，但也提供了通過JavaScript的來設(shè)置自定義錯誤提示信息
增強(qiáng)的頁面元素
1、figure元素
figure是個組合元素，可以帶標(biāo)題figcaption，一個figure只允許放置一個figcaption
2、details元素
details提供了一種替代Javascript的、將畫面上局部區(qū)域進(jìn)行展開或收縮的方法
3 、mark元素
mark元素表示頁面需要突出顯示或高亮顯示的部分，經(jīng)典的是搜索結(jié)果
4、progress元素
可以給progress設(shè)置value和max屬性，value表示已經(jīng)進(jìn)行的，max表示總數(shù)，value和max只能為有效的浮點(diǎn)數(shù)，value必須大于0小于等于max。如果不給progress設(shè)置這兩個屬性，則是動態(tài)顯示正在進(jìn)行，進(jìn)度不確定。
5、 meter元素
定義度量衡
6、改良的ol列表
在HTML5中為ol元素添加了start屬性和reversed屬性
7、改良的dl列表
dl是專門用來定義術(shù)語的列表，在HTML5中為dt增加了名字dfn
8、 另外還有cite用于表示作者，small用于標(biāo)識“小型文本”等
HTML5中input元素新增加哪些type屬性值？它們有什么作用？
在HTML5中，為input元素新增了以下一些type屬性值，用來豐富文本框的類型。
?color：用于指定顏色的控件。
?date：用于輸入日期的控件（年，月，日，不包括時間）。
?datetime：基于 UTC 時區(qū)的日期時間輸入控件（時，分，秒及幾分之一秒）。
?datetime-local：用于輸入日期時間控件，不包含時區(qū)。
?email：用于編輯 e-mail 的字段。
?month：用于輸入年月的控件，不帶時區(qū)。
?number: 用于輸入浮點(diǎn)數(shù)的控件。
?range：用于輸入不精確值控件。
?search：用于輸入搜索字符串的單行文本字段。換行會被從輸入的值中自動移除。
?tel：用于輸入電話號碼的控件。
?time：用于輸入不含時區(qū)的時間控件。
?url：用于編輯URL的字段。。
?week：用于輸入一個由星期-年組成的日期，日期不包括時區(qū)。推薦你去一個教學(xué)網(wǎng)站 秒秒學(xué)上把這些知識過一遍，夯實(shí)下基礎(chǔ)。
網(wǎng)站名稱：html5元素屬性,html5元素屬性大全
鏈接分享：http://fisionsoft.com.cn/article/dsshpog.html
