● :checked
:checked 선택자는 체크박스가 표시되어 있으면 스타일을 적용합니다. 다음 코드는 체크박스가 선택되어 있으면 인접한 형제 요소인 label 태그의 텍스트에 빨간색 스타일을 적용합니다.
05/04/checkbox_pseudo.html
<style>
input:checked + label{
color:red;
}
</style>
● :disabled
:disabled 선택자는 상호작용 요소가 비활성화되어 있으면 스타일을 적용합니다. 다음 코드는 입력 요소에 disabled 속성이 있으므로 입력 요소의 배경색(background-color)에 회색(#ccc)을 적용합니다.
05/04/disabled_pseudo.html
<style>
input:disabled,
button:disabled{
background-color:#ccc;
}
</style>
(중략)
<input type="text" disabled>
<button disabled>버튼</button>