HTML5新標籤
HTML5
特點
新標籤
<header>...<header>
頭部標籤
<footer>...<footer>
尾部標籤
<section>...<section>
內容區塊
<article>...,article>
表示頁面中的獨立內容
<aside>...<aside>
標籤定義其所處內容之外的內容
<nav>...<nav>
導航
-
<nav>裡面可以直接寫<li></li>
-
<nav> <li></li> </nav>
<figure>...<figure>
表示一段獨立的流內容,一般表示文件主體流內容中的一個獨立單元。規定獨立的流內容(影象、
圖表、照片、程式碼等等)。使用figcaption元素為figure元素新增標題。
◆ figure 是一種元素的組合,帶有可選 標題。用來表示網頁上一塊獨立的內容。figure 元素的內容
應該與主內容相關,但如果被刪除,則不應對文件流產生影響
<embed>...<embed>
embed標籤用於定義巢狀的內容,包括各種媒體
<mark>...<mark>
高亮顯示
- 可以改變其高亮顏色
<video>...<video>
<video src="song.mp3" controls="controls" autoplay=autoplay>
</video>
- src是視訊路徑
- autoplay 設定自動播放
- controls (controls="controls")向用戶展示控制元件 ,例如播放按鈕
- loop迴圈播放
- preload 視訊在頁面載入時進行載入,並預備播放
<audio>...<audio>
音訊標籤
<audio src="song.mp4" controls="controls" autoplay=:autoplay> </audio>
- src是視訊路徑
- autoplay 設定自動播放
- controls (controls="controls")向用戶展示控制元件 ,例如播放按鈕
<datalist>...<datalist>
智慧列表 供其選擇
<p>
/* list裡的id要和datalist裡的id一致 */
<input type="text" nmae="a1" list="text">
</p>
<datalist id="text">
<option>大班</option>
<option>班級</option>
<option>班班</option>
</datalist>
<canvas>...<canvas>
canvas可以完成動畫、遊戲、圖表、影象處理等原來需要Flash完成的一些功能
<hgroup>...<hgroup>
標籤被用來對標題元素進行分組。
當標題有多個層級(副標題)時,<hgroup>
元素被用來對一系列 <h1> - <h6>
元素進行分組。
表單元素
type=email
控制input輸入框中的型別 具有multiple屬性,它
允許在該文字框中輸入一串以逗號分隔的email地址
- required="required"表示欄位的驗證內容不能為空
type=url
控制input輸入框內的型別為網址
type=number
控制input輸入框的型別為數字
- value設定預設值
- min設定最小值
- max設定最大值
- step設定遞增的值
type="range"
滑塊
- value設定預設值
- min設定最小值,自己也算第一步
- max設定最大值,自己也算第一步
- step設定遞增的值,自己也算第一步
date pickers
type=" "
- datetime-local 本地時間
placeholder
文字框處於未輸入狀態時文字框中顯示的輸入提示
autofocus="autofocus"
自動聚焦功能
焦點,一個頁面只能有一個聚焦
autocomplete
輸入自動填充完成
maxlength
最大長度
novalidate
取消驗證