04. Web大前端時代之:HTML5+CSS3入門系列~HTML5 表單


Web大前端時代之:HTML5+CSS3入門系列:http://www.cnblogs.com/dunitian/p/5121725.html

一、input新增類型

1.tel輸入類型用於應該包含電話號碼的輸入字段

 

2.url用於應該包含 URL 地址的輸入字段 - 提交表單時對 url 字段的值自動進行驗證

<form action="/test.html" method="post">

url:<input type="url" name="user_url" /><input type="submit" />

</form>

 

注意要帶ftp:// http:// https:// 等等的前綴頭才可以

 

 

3.email用於 e-mail 地址的文本字段

<form action="/test.html" method="post">

email:<input type="email" name="user_email" /><input type="submit" />

</form>

 

 

4.number輸入類型用於包含數字值的輸入字段 - 可以設置可接受數字的限制

<form action="/test.html" method="post">

number:<input type="number" name="user_number" min="1" max="10" /><input type="submit" />

</form>

 

 

5.search:用於搜索字段,比如站內搜索或谷歌搜索等 - 搜索字段的外觀與常規的文本字段無異

<input type="search" />

 

 

6.color 定義拾色器。

 

7.range輸入類型用於應該包含指定范圍值的輸入字段 - range 類型顯示為滑塊

 

 

8.日期檢出器類型

HTML5擁有多個可供選則日期和時間的新型文本輸入框

date定義日期字段

接受結果

 

 

month定義日期字段的月

接受結果

 

 

week定義日期字段的周

接受結果

 

 

time:定義日期字段的時、分、秒

接受結果

 

 

datetime定義日期字段

 

 

datetime-local定義日期字段

接受結果

大綱圖:

二、input新增屬性

 

 

三、form新增類型和屬性:

 

附錄:

火狐表現:

 

IE表現:

 

谷歌表現:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM