建站
咨詢
售后
建站咨詢
新聞中心
這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
HTML5標(biāo)簽使用方法
標(biāo)簽規(guī)定用戶可輸入數(shù)據(jù)的輸入字段。根據(jù)不同的 type 屬性，輸入字段有多種形態(tài)。輸入字段可以是文本字段、復(fù)選框、密碼字段、單選按鈕、按鈕等等。
本章全面介紹這些新的輸入類型：
-
color
-
date
-
datetime
-
datetime-local
-
email
-
month
-
number
-
range
-
search
-
tel
-
time
-
url
-
week
注意:并不是所有的主流瀏覽器都支持新的input類型，不過您已經(jīng)可以在所有主流的瀏覽器中使用它們了。即使不被支持，仍然可以顯示為常規(guī)的文本域。
Input 類型: color
color 類型用在input字段主要用于選取顏色，如下所示：
實(shí)例
從拾色器中選擇一個顏色:
選擇你喜歡的顏色: type="color" name="favcolor">
Input 類型: date
date 類型允許你從一個日期選擇器選擇一個日期。
實(shí)例
定義一個時間控制器:
生日: type="date" name="bday">
Input 類型: datetime
datetime 類型允許你選擇一個日期（UTC 時間）。
實(shí)例
定義一個日期和時間控制器（本地時間）:
生日 (日期和時間): type="datetime" name="bdaytime">
Input 類型: datetime-local
datetime-local 類型允許你選擇一個日期和時間 (無時區(qū)).
實(shí)例
定義一個日期和時間 (無時區(qū)):
生日 (日期和時間): type="datetime-local" name="bdaytime">
Input 類型: email
email 類型用于應(yīng)該包含 e-mail 地址的輸入域。
實(shí)例
在提交表單時，會自動驗(yàn)證 email 域的值是否合法有效:
E-mail: type="email" name="email">
Input 類型: month
month 類型允許你選擇一個月份。
實(shí)例
定義月與年 (無時區(qū)):
生日 (月和年): type="month" name="bdaymonth">
Input 類型: number
number 類型用于應(yīng)該包含數(shù)值的輸入域。 您還能夠設(shè)定對所接受的數(shù)字的限定：
實(shí)例
定義一個數(shù)值輸入域(限定):
數(shù)量 ( 1 到 5 之間 ): type="number" name="quantity" min="1" max="5">
使用下面的屬性來規(guī)定對數(shù)字類型的限定：
| 屬性 | 描述 |
|---|---|
| disabled | 規(guī)定輸入字段是禁用的 |
| max | 規(guī)定允許的最大值 |
| maxlength | 規(guī)定輸入字段的最大字符長度 |
| min | 規(guī)定允許的最小值 |
| pattern | 規(guī)定用于驗(yàn)證輸入字段的模式 |
| readonly | 規(guī)定輸入字段的值無法修改 |
| required | 規(guī)定輸入字段的值是必需的 |
| size | 規(guī)定輸入字段中的可見字符數(shù) |
| step | 規(guī)定輸入字段的合法數(shù)字間隔 |
| value | 規(guī)定輸入字段的默認(rèn)值 |
顯示詳細(xì)信息
Input 類型: range
range 類型用于應(yīng)該包含一定范圍內(nèi)數(shù)字值的輸入域。
range 類型顯示為滑動條。
實(shí)例
定義一個不需要非常精確的數(shù)值（類似于滑塊控制）:
type="range" name="points" min="1" max="10">
Input 類型: url
url 類型用于應(yīng)該包含 URL 地址的輸入域。
在提交表單時，會自動驗(yàn)證 url 域的值。
實(shí)例
定義輸入URL字段:
添加您的主頁: type="url" name="homepage">
Input 類型: week
week 類型允許你選擇周和年。
實(shí)例
定義周和年 (無時區(qū)):
選擇周: type="week" name="week_year">
HTML5 標(biāo)簽
| 標(biāo)簽 | 描述 |
|---|---|
| 描述input輸入器 |
分享文章：HTML5標(biāo)簽使用方法
本文地址：http://fisionsoft.com.cn/article/cdcsjgd.html
