Programming/HTML CSS
상태 선택은 사용자로 부터 어떤 값를 입력받는 요소에 많이 쓰이는 선택자 입니다.
<input type="radio" id="man" name="sex" />남<br />
<input type="radio" id="woman" name="sex"  disabled="disabled" />여

<span id="o_man">남자를 선택함.</span>
<span id="o_false">사용 불가</span>
(1) checked

input 요소를 check 상태로 만들었을때를 의미합니다.
#man:checked ~ #o_man {
 color:red;
}
▶ man id 의 input 요소를 check 상태로 만들면 그 앞에 있는 모든 요소중 id가 o_man인 tag에 style을 적용

(2) disabled / enabled
#woman:disabled ~ #o_false {
 color:blue;
}
▶ woman id의 input 요소가 disabled 로 사용이 불가능하면 그 앞에 있는 모든 요소중 id가 o_false인 tag에 style을 적용, 반면 enabled 로 하면 사용가능임.

(3) focus
input:focus {
 color:red;
}
▶ input 요소중 focus 상태인 것이 있으면 해당 input에 style을 적용

'Programming > HTML CSS' 카테고리의 다른 글

[CSS3] 초기화 코드 사이트  (0) 2013.07.01
[HTML5] track (video 자막)  (0) 2013.06.28
[CSS3] 선택자 - 상태 선택  (0) 2013.06.24
[HTML] base  (0) 2013.06.20
[CSS3] linear-gradient  (0) 2013.06.19
[CSS3] 선택자 - 자손 선택  (0) 2013.06.17
0 0