html5新增標簽
mark 標記
meter 表示度量
progress 進度條
ruby 注釋
rt 對ruby元素內容的解釋
rp 當瀏覽器不支持ruby元素的時候顯示的內容
time 表示一個時間點
datalist:配合input使用,並且通過input的list屬性和datalist的id屬性進行綁定
datalist相對於select多了一個自動查詢的功能
h5新增的表單元素
新增的類型
email:可以自動驗證輸入的字符串是否是一個合法的郵箱地址
url:自動驗證文本框內容是否是一個合法的URL地址
number:可以指定最大最小值以及數字改變的幅度,並且可以校驗輸入的數字是否在指定范圍內,文本框只能輸入數字
range:表示一個范圍
Date Picker:
date:選取日、月、年
month:選取月、年
week:選取周和年
time:選取時間(小時和分鍾)
datetime:選取時間、日、月、年(本地時間)
search:搜索
在移動端可以調取鍵盤的搜索按鈕
output用法
<form oninput="x.value = parseInt(a.value) + parseInt(b.value)"> 0 <input type="range" id="a" value="50"> 100 + <input type="number" id="b" value="50"> = <output name="x" for="a b"></output> </form>
<canvas></canvas>標簽
canvas的詳細用法還需配合JavaScript使用
audio:音頻
src:音頻的資源位置
controls:控制條
autoplay:自動播放
loop:循環播放
preload:預加載
video:視頻
視頻和音頻支持的格式
用於視頻:
video / ogg
video / mp4
video / webm
用於音頻:
audio / ogg
audio / mpeg
source:導入視頻或者音頻資源
h5新增的語義標簽
header 定義section或page的頁眉
footer 定義section或page的頁腳
section 定義section
article 定義文章
aside 定義頁面內容之外的內容 側邊欄
都跟div的用法一模一樣
唯一的區別就是這些標簽具備語義
summary 為details元素定義可見的標題
details 定義元素的細節
示例:
<details> <summary>點擊展開</summary> 文本詳細內容··· </details>