样式
一、伪类
input:enabled
input:enabled 任何当前启用的元素，可以被激活（选择、点击、输入等）或接受焦点；也有一个禁用状态，在这个状态下，它不能被激活或接受焦点。
input:disabled
input:disabled 任何当前禁用的元素都有一个启用的状态，这意味着如果它没有被禁用，它可以被激活（选择、点击、输入等等）或接受焦点。
input:read-only
input:read-only 不能被用户编辑的元素 。
input:read-write
input:read-write 可以被用户编辑的元素。
input:placeholder-shown
input:placeholder-shown 当前显示 placeholder 文字的元素，包括有 placeholder 显示，尚未拥有值的 <input>和 <textarea> 元素。
input:default
input:default 在一组相关元素中属于默认的表单元素。匹配 checkbox 和 radio 在页面加载或渲染时被选中的输入类型。
input:checked
input:checked 匹配当前被选中的 checkbox 和 radio 输入类型（以及当前被选中的 <select> 中的 <option>）。
input:indeterminate
input:indeterminate indeterminate 属性被 JavaScript 设置为真的 checkbox 元素，表单中所有具有相同名称值的单选按钮被取消选中的 radio 元素，以及处于不确定状态的 <progress> 元素。
input:valid
input:valid 可以应用约束验证的表单控件，并且当前是有效的。
input:invalid
input:invalid 应用了约束条件验证的表单控件，并且当前是无效的。匹配一个表单控件，它的值与它的属性设置的约束条件不一致，如 required、pattern、step 和 max。
input:in-range
input:in-range 一个非空的输入，其当前值在 min 和 max 属性以及 step 指定的范围限制内。
input:out-of-range
input:out-of-range 一个非空的输入，其当前值不在 min 和 max 属性以及 step 指定的范围限制内。
input:required
input:required 有 required 属性设置的 <input>、<select> 或 <textarea> 元素。只匹配可以被 required 的元素，不匹配不能被 required 的元素。
input:optional
input:optional 没有 required 属性设置的 <input>、<select> 或 <textarea> 元素。只匹配可以被 required 的元素，不匹配不能被 required 的元素。
input:blank
input:blank 没有值的 <input> 和 <textarea> 元素。
input:user-invalid
input:user-invalid 与 :invalid 相似，但是在失焦的情况下激活。匹配无效的输入，但只在用户交互之后，例如关注该控件、离开该控件或试图提交包含无效控件的表单。
二、伪元素
2.1 input::placeholder
input::placeholder 默认情况下，占位符文本的外观是半透明或 浅灰色。::placeholder伪元素是输入的 placeholder 文本。可以使用有限的 CSS 属性子集为其赋予样式。
三、属性选择器
使用属性选择器，可以根据表单控件的 type 来锁定不同类型的表单控件。CSS 属性选择器只需根据一个属性的存在或一个给定属性的值来匹配元素。
/* 匹配密码输入 */
input[type="password"] {
}
/* 匹配合法值限制在一个范围内的表单控件 */
input[min][max] {
}
/* 匹配含有 pattern 属性的表单控件 */
input[pattern] {
}