코딩의 시작, TCP School

상태 의사 클래스를 사용하면 입력 양식의 상태에 따라 각각의 스타일을 별도로 설정할 수 있습니다.

CSS에서 사용할 수 있는 상태 의사 클래스는 다음과 같습니다.

- :checked
- :enabled
- :disabled

:checked는 input 요소 중에서 체크된(checked) 상태의 input 요소를 선택합니다.

<style>

input { color: #FFEFD5; }

input:checked + span { color: #CD853F; }

</style>

:enabled는 input 요소 중에서 사용할 수 있는 input 요소를 선택합니다.

또한, :disabled는 input 요소 중에서 사용할 수 없는 input 요소를 선택합니다.

<style>

input { color: #FFEFD5; }

input:disabled + span { color: #CD853F; }

</style>

의사 클래스	설명
:checked	체크된(checked) 상태의 input 요소를 모두 선택함.
:enabled	사용할 수 있는 input 요소를 모두 선택함.
:disabled	사용할 수 없는 input 요소를 모두 선택함.

Search