:required

版本： CSS3

CSS伪类 :required 表示任意 <input> 元素表示任意拥有 required 属性的 <input> 、 <select> 或 <textarea> 元素使用它。它允许表单在提交之前容易的展示必填字段并且渲染其外观.

语法:

E : required { sRules }

• :required 选择器选择具有 required 必需属性的表单元素，在表单元素是必填项时设置指定样式，用于表单可选元素提供外观。表单元素可以使用 required 属性来设置必填项。
• :required 选择器只适用于表单元素: <input> 、 <select> 或 <textarea> 。
• :required 选择器 IE10、Opera10以下不支持。

浏览器支持

IE10+以及新版浏览器都支持 :required
IE9及更早IE版本不支持 :required 选择器。

例子

//HTML

<form>
  <label for="url_input">非必填项:</label>
  <input type="text" id="url_input" />
  <br />
  <br />
  <label for="email_input"><b>*</b>必填项:</label>
  <input type="text" id="email_input" required />
</form>

//CSS

form{
  width: 35%;
  padding: 10px;
  margin: 0 auto;
}
label{
  cursor: pointer;
}
label b{
  color: red;
}
input:required{
  background-color: #800000;
  color: #fff;
}