1.新增布局標簽
header 整個頁面,或部分區(qū)域的頭部
footer 整個頁面,或部分區(qū)域的底部
nav 導航
artical 文章、帖子、雜志、新聞、博客、評論等
section 頁面中的某段文字,或文章中的某段文字(里面文字通常里面會包含標題)
aside 側邊欄
2.新增狀態(tài)標簽

image.png
<span>手機電量:</span>
<meter max="100" value="70" low="10" high="20" optimum="90"></meter>
<span>當前進度:</span>
<progress max="100" value="20"></progress>

image.png
3.新增列表標簽

image.png
<form action="#">
<input type="text" list="mydata">
<button>搜索</button>
</form>
<datalist id="mydata">
<option value="張一">張一</option>
<option value="張二">張二</option>
<option value="李三">李三</option>
<option value="李四">李四</option>
</datalist>
<br>
<details>
<summary>問題</summary>
<p>對于問題的解釋</p>
</details>

image.png

image.png
4.新增文本標簽
4.1 文本注音
ruby 包裹需要注音的文字
rt 寫注音,rt標簽寫在ruby的里面
<ruby>
<span>尚硅谷</span>
<rt>shàng guī gǔ</rt>
</ruby>

image.png
4.2 文本標記
mark
5.表單相關的新增
5.1新增表單控件屬性
placeholder="" 提示文字
required 必填
autofocus 自動獲取焦點
autocomplete="" 值為on/off
pattern="正則表達式" 與required配合
5.2input新增的type屬性值

image.png
<form action="" novalidate>
<div>
郵箱:
<input type="email" name="email">
</div>
<div>
url:
<input type="url" name="url">
</div>
<div>
數值:
<input type="number" name="number" step="2">
</div>
<div>
搜索:
<input type="search" name="keyword">
</div>
<div>
電話:
<input type="tel" name="phone">
</div>
<div>
范圍:
<input type="range" name="range" max="80" min="0" value="22">
</div>
<div>
顏色選擇器:
<input type="color" name="color">
</div>
<div>
日期:
<input type="date" name="date">
月份:
<input type="month" name="month">
周:
<input type="week" name="week">
時間:
<input type="time" name="time">
日期+時間:
<input type="datetime-local" name="time2">
</div>
<button>提交</button>
</form>

image.png
6.新增多媒體標簽
video
audio