简介
:optional 选择器用于选择可选元素，即存在或不存在的元素。它与 :required 选择器相反，后者选择必须存在的元素。
语法
---------------- - -- -- -- -
其中，element 是要选择的元素。
用法
:optional 选择器可用于以下场景：
- 样式化可能不存在的元素，例如页脚或侧边栏。
- 样式化可能包含可选内容的元素，例如列表项或表单字段。
- 样式化可能具有不同状态的元素，例如启用或禁用按钮。
示例
样式化可能不存在的元素
-------- ----------- ---------
--------------- - -------- ----- ---------------- ------- -
样式化可能包含可选内容的元素
---- ------ ------ ------ ------ ------ - --------- -----
-- ----------- - ----------- ------- -
样式化可能具有不同状态的元素
-------- -- ---------
--------------- - ------- -------- - ------------------------- - ------- ------------ -
支持情况
:optional 选择器得到所有现代浏览器的支持，包括：
- Chrome
- Firefox
- Safari
- Edge
- Opera
替代方案
在 CSS 2.1 之前，没有专门的 :optional 选择器。但是，可以使用以下替代方法：
----------------- - -- -- -- -
---------------------- - -- -- -- -
注意事项
:optional选择器只选择不存在或包含可选内容的元素。它不选择内容为空的元素。:optional选择器不能与:required选择器同时使用。:optional选择器可以与其他选择器组合使用。
结论
:optional 选择器是一个有用的工具，用于样式化可能不存在或包含可选内容的元素。它可以帮助创建更灵活和健壮的 CSS 布局。