html5表单

1）表单多了list属性，它可以完成这样一个功能“你想输入可以输入，想选择预设选项可以选择预设选项”，这在别的语言中GUI组件一般都会包含它，但在html中之前它都是通过js实现的。html可以实现它，效果如同一个text加上一个select一样。

<input id=abc type=text list=mylist>

<datalist id=mylist>

<option label=name value=adang>

<option label=sex value=male>

</datalist>

2) autofocus。

支持让表单元素自动获得焦点了，通常用在页面初始化时。

3）placeholder。

设置输入框的提示字符，但获得焦点时自动清空。现在都是用js实现的，html5可以原生支持。

4) required。

表明表单是必填的。

5）multiple属性。

表明表单项是可以多选的，可用于type=email类型和type=file类型（html终于原生支持多文件上传了）

6）pattern属性。

表单的输入项必须满足的正则格式。虽然type=email、type=url等类型内置了正则格式，但我们还可以给type=text也定义我们需要的格式。这样，js验证可以完全避免了。

7）min、max、step。

最小值、最大值和渐进的程度。用于type=number和type=range类型非常合适。

8）一个使用type=range的例子。

<input type=range min=1 max=11 name=tap>

<output onforminput="value=tap.value"></output>

<style>

input[type=range]::before{content:attr(min);}

input[type=range]::after{content:attr(max);}

input[type=range]{width:500px;color:read;font-family:cursive;font-size:2em;}

</style>

9)可以结合:invalid和:required伪类来给表单验证添加样式。