:checked
:enabled
:disabled
- :checked
<style>
label {background-color: red; display: block;}
:checked{width: 50px;}
</style>
<body>
<label><input type="checkbox"> 1-1 </label>
<label><input type="checkbox"> 1-2 </label>
<label><input type="radio" name="test"> 2-1 </label>
<label><input type="radio" name="test"> 2-2 </label>
</body>
:checked
适配 radio
和 checkbox
中被选中的元素。
- :enabled
<style>
label {background-color: red; display: block;}
:enabled{width: 50px;}
</style>
<body>
<label><input type="checkbox"> 1-1 </label>
<label><input disabled type="checkbox"> 1-2 </label>
<label><input type="radio" name="test"> 2-1 </label>
<label><input type="radio" name="test"> 2-2 </label>
</body>
匹配所有非 disabled
状态下的表单元素,该选择器与 :disabled
选择器是对立的。
- :disabled
<style>
label {background-color: red; display: block;}
:disabled{width: 50px;}
</style>
<body>
<label><input type="checkbox"> 1-1 </label>
<label><input disabled type="checkbox"> 1-2 </label>
<label><input type="radio" name="test"> 2-1 </label>
<label><input type="radio" name="test"> 2-2 </label>
</body>
匹配所有带 disabled
属性的表单元素,该选择器与 :enabled
选择器是对立的。