html5 新增內容

新增表單控制元件

email 電子郵箱文字框

<input type="email" name="" id="">

tel 電話號碼

<input type="tel" name="" id="">

url 網頁URL地址

<input type="url" name="" id="">

search 搜尋引擎

<input type="search" name="" id="">

date 日期型別

<input type="date" name="" id="">

time 時間

<input type="time" name="" id="">

range 特定範圍內的數值選擇器

<input type="range" name="" id="">

number 只包含數字的輸入框

<input type="number" name="" id="">

新增表單特性

placeholder 輸入框提示資訊

<input type="text" name="" id="" placeholder="請輸入使用者名稱">

autocomplete 是否儲存使用者輸入值

• autocomplete是否儲存使用者輸入值，預設為on，關閉提示選擇off

autofocus 指定表單獲取輸入焦點

<input type="text" name="" autofocus>

required 此項必填，不為空

<input type="text" name="usr_name" required="required">

pattern

• 正則驗證 pattern=”\d{1,5}”

disabled 表單禁用狀態

<p>Last name: <input type="text" name="lname" disabled></p>

datalist 選項列表

• 與input元素配合使用，來定義input可能的值

<label for="myBrowser">從列表中選擇這個瀏覽器</label>
<input list="browsers" id="myBrowser" name="myBrowser">
    <datalist id="browsers">
        <option value="Chrome">
        <option value="Firefox">
        <option value="Internet Explorer">
        <option value="Opera">
        <option value="Safari">
        <option value="Microsoft Edge">
    </datalist>