:optional

版本：CSS3

CSS伪类:optional表示任意没有required属性的，或元素使用它。即非必填的元素。

语法:

E:optional{sRules}

• :optional选择器选择没有必需属性（required属性）的表单元素，在表单元素是可选项时设置指定样式。
• 表单元素中设置有required属性，是必填项。如果没有特别设置required属性即为optional属性。
• :optional选择器只适用于表单元素:，或元素。
• 浏览器：IE10以下、Opera10以下不支持。

/* selects any optional */input:optional {border: 1px dashed black;}

它允许表单容易的展示可选字段并且渲染其外观。

注：为必填字段设置外观，请使用:required伪类。

浏览器支持

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

例子

//HTMLoption1option2option3option4option5option1option2option3option4option5//CSSinput,select,textarea{margin-bottom: 30px;}input:optional,textarea:optional {border: 5px solid black;}input:required,textarea:required {border: 5px solid green;}select:optional {color:blue;}select:required {color:pink;}option1option2option3option4option5option1option2option3option4option5.demo1 input,.demo1 select,.demo1 textarea{margin-bottom: 30px;}.demo1 input:optional,.demo1 textarea:optional{border: 5px solid black;}.demo1 input:required,.demo1 textarea:required{border: 5px solid green;}.demo1 select:optional{color:blue;}.demo1 select:required{color:pink;}