HTML5新知識有哪些

這篇文章主要為大家展示了“HTML5新知識有哪些”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“HTML5新知識有哪些”這篇文章吧。

一、h6新增的主要語義化標簽如下：

1、header 頁面頭部、頁眉

2、nav 頁面導航

3、atricle 一篇文章

4、section 文章中的章節

5、aside 側邊欄

6、footer 頁面底部、頁腳

PC端兼容h6新標簽的方法，在頁面中引入一下js文件

<script  type="text/javascript"  src="//cdn.bootcss.com/html5shiv/r29/html5.js?1.1.11"></script>

二、HTML5新增表單控件

1、新增類型：網址  郵箱  日期  時間  星期  數量  范圍  電話  顏色  搜索

　　a、<label>網址：</label><input type="url" name=" " required>
　　b、<label>郵箱：</label><input type="email" name=" " required>
　　c、<label>日期：</label><input type="date" name=" ">
　　d、<label>時間：</label><input type="time" name=" ">
　　e、<label>星期：</label><input type="week" name=" ">
　　f、<label>數量：</label><input type="number" name=" ">
　　g、<label>范圍：</label><input type="range" name=" " >
　　h、<label>電話：</label><input type="tel" name=" " >
　　i、<label>顏色：</label><input type="color" name=" ">
　　j、<label>搜索：</label><input type="search" name=" ">

2、新增常用表單控件屬性

<input  type="text"  placeholder="請輸入用戶名"  autofocus  autocomplete="off">

　　a、placeholder  設置文本框默認提示文字

　　b、autofocus  自動獲得焦點

　　c、autocomplete  設置是否有聯想關鍵詞下拉，一般設置為"off",將其關掉   如：autocomplete="off"

三、HTML5音頻audio和視頻video

html5增加了audio和video標簽，提供了在頁面上插入音頻和視頻的標準方法

1、audio標簽  支持格式：ogg、wav、mp3

對應的屬性：

　　a、autoplay  自動播放

　　b、controls 顯示播放器

　　c、loop  循環播放器

　　d、preload 預加載

　　e、multed 靜音

如：<audio src="source/audio.mp3" autoplay controls loop preload></audio>

<audio autoplay controls loop preload>

　　<source src="source/audio.wav" type="">

　　<source src="source/audio.mp3" type="">

</audio>

source標簽的作用是提供多個媒體文件地址，如果一個地址的文件不兼容，就使用下一個地址。

2、video標簽  支持格式：ogg、mp4、webM

對應的屬性：

　　a、width

　　b、height

　　c、Poster

如：<video src="source/audio.mp3" autoplay controls loop preload width="600" height="400"></video>

3、可選擇第三方播放器

　　a、cyberplayer

　　b、tencentPlayer

　　c、youkuPlayer

以上是“HTML5新知識有哪些”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！