HTML5知識點總結
一.新增語義化標簽
<header></header>????頭標簽
<nav></nav>????導航
<article></article>????文章
<section></section>????文檔中的節
<footer></footer>????腳注 ? 底部
<aside></aside>????側邊欄
二.其他標簽
<details>
????????<summary>標題</summary>
????????其他內容
? </details>
<time></time>????????????<time? datetime="日期"></time>
進度條????<progress ? value=""? min=""? max=""? ></progress>
度量衡????<meter? value=""? min=""? max=""? low=""? high=""></meter>
數據列表
<input? list="id值">
<datalist? id="值">
????????<option? value=""></option>
????????<option? value=""></option>
????????。。。。
</datalist>
三.form新增控件
<input type="email"/>????????郵箱 ??
<input type="url"/>????????地址
<input type="number" ? min="" max=""? step=""/>????????數字 ? ? ? step表示步長
<input type="range" min=""? max=""? step=""/>????????滑動條
年月日????<input type="date"/>
年月????<input type="month"/>
年周????<input type="week"/>
時間(時分)????<input type="time"/>
年月日時分(utc時間)??????<input? type="datetime"/>
年月日時分(本地時間)???????<input? type="datetime-local"/>
搜索域 ?? <input? type="search"/>
顏色 ? ? ?? <input ? type="color" ? value="十六進制"/>
電話 ? ? ?? <input ? type="tel"? pattern="\d{11}"/>????????\d數字[0,9] ????{11}重復前一項11次
新增屬性
placeholder ???文本提醒
required ??????必填項
autocomplete ??自動補全 ? ? ? ? 值:1)on ?默認開啟自動補全 ? 2)off ?關閉自動補全
autofocus ?????自動獲取焦點
readonly ??????只讀狀態
四.多媒體
1.音頻
?<audio ? src="音頻路徑"></audio>
兼容
<audio>
????????<source? src="音頻路徑"? type="audio/ogg"></source>
????????<source? src="音頻路徑" ? type="audio/mpeg"></source>
????????....
? ? ?? 你的瀏覽器不支持audio標簽
</audio>
audio屬性:
1)controls ????控件
2)autoplay ????自動播放
3)loop ????????重復播放
2.視頻
<video? src="視頻路徑"></video>
兼容
<video>
? ? ? ?? <source? src="視頻路徑" ? type="video/ogg"></source>
????????<source src="視頻路徑" ?? type="video/mp4"></source>
????????......
????????你的瀏覽器不支持video標簽
</video>
video屬性:
1)controls ????控件
2)autoplay ????自動播放
3)loop ????????重復播放
4)muted ???????靜音
5)poster ????值:“圖片路徑” ? ? 視頻的背景圖片