目录

   4.5、用input元素获取有规定格式的字符串

   4.6、用input元素获取时间和日期

   4.7、用input元素获取颜色值

5、用input元素获取搜索用词

6、用input元素生成隐藏的数据项

7、用input元素生成图像按钮和分区影响图

8、用input元素上传文件

4.5、用input元素获取有规定格式的字符串

type属性设置为：email、tel、url的input元素能够接受的输入数据为有效的电子邮箱地址、电话号码和URL

email型、tel型和URL型input元素可用的额外元素：

⚠️email型input元素还支持multiple属性-可以接受多个电子邮箱地址。

<input type="email"  placeholder="user@domain .com"  id="email"  name="email"/>
<input type="tel"  placeholder="xxx-xxx-xxx"  id="tel"  name="tel"/>
<input type="url "  id="url"  name="url"/>

所有主流浏览器都支持email型input元素，而url型input元素不一定，对tel型input元素的支持最差。

4.6、用input元素获取时间和日期

用于输入日期和时间的input元素可用的额外属性：

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

4.7、用input元素获取颜色值

color型input元素只能用来选择颜色。

input元素中的颜色值以7个字符的格式表示：以#开头➕三个两位十六进制数（分别代表红绿蓝三种原色的值。）

<input  type="color"  id="color"  name="color"/>

5、用input元素获取搜索用词

search型input元素会生成一个单行文本框，供用户输入搜索用词。

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

6、用input元素生成隐藏的数据项

hidden型的input元素用法：使用一些用户看不到或不能编辑的数据项，但又要求提交表单时也能将其发送给服务器。

<input type="hidden" name="email"  value="1234"/>

⚠️只有那些出于方便或易用性考虑而不是因为机密或涉及安全原因需要隐藏的数据才适合使用这种input元素。

7、用input元素生成图像按钮和分区影响图

image型input元素生成的按钮显示为一幅图像，点击它可以提交表单。

image型input元素可用的额外属性：

<input type="image" src="Accept .png" name="submit"/>

在发送的数据中包括来自那个image型input元素的两个数据项，它们分别代表用户点击位置相对于图像左上角的x坐标和y坐标。

8、用input元素上传文件

file型input元素：可以在提交表单时将文件上传到服务器。

file型input元素可用的额外属性：

<input type=" file"   name="filedata"/>