2、:invalid用于匹配输入值为非法的元素
3、required 属性规定必需在提交之前填写输入字段
4、pattern 属性规定用于验证输入字段的正则表达式
:valid/:invalid 选择器用于在表单元素中的值是合法/非法时设置指定样式。
注意： :valid/:invalid 选择器只作用于能指定区间值的元素，例如 input 元素中的 min 和 max属性，及正确的 email 字段, 合法的数字字段等。
required 属性适用于以下 <input>类型：text, search, url, telephone, email, password, date pickers, number, checkbox, radio 以及 file。当然textarea也可以。
预览地址：
这时候点击提交，就好自动校验了，而且HTML5会直接添加Tips提示用户，请看下列示例（虽然样式不是很美观）：
CSS的意思是“层叠样式表”，你知道“层叠”是什么意思吗？就是后面的样式会叠加到前面已有的同一类样式上并覆盖它。就比如你这个问题中的，前面的已设为 padding: 3px 3px 3px 5px，而后面又设为 padding: 5px 3px 3px 5px，那么最终呈现在页面上的效果就是 padding: 5px 3px 3px 5px，就好像画油画，新画上去的颜色会把原有的颜色盖住，那么最终出现在观众眼中的就是后来画上去的颜色。当然，只有 .basic-grey textarea 的 padding会被改为 5px 3px 3px 5px，其他三个并列的选择器仍然是 3px 3px 3px 5px 的。
