H5新標簽(適合新手入門)持續更新，歡迎閱讀，小白自學，一起共勉！！！加油！！ ...
H5新標簽
文檔類型設定
document
HTML: sublime 輸入 html:4s
XHTML: sublime 輸入 html:xt
HTML5 sublime 輸入 html:5 <!DOCTYPE html>
字元設定
<meta http-equiv="charset" content="utf-8">：HTML與XHTML中建議這樣去寫
<meta charset="utf-8">：HTML5的標簽中建議這樣去寫
常用新標簽
w3c 手冊中文官網 : http://w3school.com.cn/
header：定義文檔的頁眉 頭部
nav：定義導航鏈接的部分
footer：定義文檔或節的頁腳 底部
article：定義文章。
section：定義文檔中的節（section、區段）
aside：定義其所處內容之外的內容 側邊
<header> 語義 :定義頁面的頭部 頁眉</header>
<nav> 語義 :定義導航欄 </nav>
<footer> 語義: 定義 頁面底部 頁腳</footer>
<article> 語義: 定義文章</article>
<section> 語義： 定義區域</section>
<aside> 語義： 定義其所處內容之外的內容 側邊</aside>
datalist 標簽定義選項列表。請與 input 元素配合使用該元素
<input type="text" value="輸入明星" list="star"/> <!-- input裡面用 list -->
<datalist id="star"> <!-- datalist 裡面用 id 來實現和 input 鏈接 -->
<option>劉德華</option>
<option>劉若英</option>
<option>劉曉慶</option>
<option>郭富城</option>
<option>張學友</option>
<option>郭郭</option>
</datalist>
fieldset 元素可將表單內的相關元素分組，打包 legend 搭配使用
<fieldset>
<legend>用戶登錄</legend> 標題
用戶名: <input type="text"><br /><br />
密 碼: <input type="password">
</fieldset>
新增的input type屬性值：
|
類型 |
使用示例 |
含義 |
|
|
<input type="email"> |
輸入郵箱格式 |
|
tel |
<input type="tel"> |
輸入手機號碼格式 |
|
url |
<input type="url"> |
輸入url格式 |
|
number |
<input type="number"> |
輸入數字格式 |
|
search |
<input type="search"> |
搜索框（體現語義化） |
|
range |
<input type="range"> |
自由拖動滑塊 |
|
time |
<input type="time"> |
小時分鐘 |
|
date |
<input type="date"> |
年月日 |
|
datetime |
<input type="datetime"> |
時間 |
|
month |
<input type="month"> |
月年 |
|
week |
<input type="week"> |
星期 年 |
常用新屬性
|
屬性 |
用法 |
含義 |
|
placeholder |
<input type="text" placeholder="請輸入用戶名"> |
占位符 當用戶輸入的時候 裡面的文字消失 刪除所有文字，自動返回 |
|
autofocus |
<input type="text" autofocus> |
規定當頁面載入時 input 元素應該自動獲得焦點 |
|
multiple |
<input type="file" multiple> |
多文件上傳 |
|
autocomplete |
<input type="text" autocomplete="off"> |
規定表單是否應該啟用自動完成功能 有2個值，一個是on 一個是off on 代表記錄已經輸入的值 1.autocomplete 首先需要提交按鈕 <br/>2.這個表單您必須給他名字 |
|
required |
<input type="text" required> |
必填項 內容不能為空 |
|
accesskey |
<input type="text" accesskey="s"> |
規定激活（使元素獲得焦點）元素的快捷鍵 採用 alt + s的形式 |
綜合案例
<form action="">
<fieldset>
<legend>學生檔案</legend>
<label for="userName">姓名:</label>
<input type="text"
