웹표준,웹접근성(html, html5, css, css3, javascript, jQuery, jQueryMobile, snecha, senchaTouch, php, mobileWebApp)

:hover 링크 - 선택자 : 마우스가 지정된 요소에 위에 올라간 상태 ex) a태그 위로 마우스가 올라간 상태 ( 예 : a:hover ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 :hover a:hover{ background-color:yellow; } :hover - 링크 선택자 마우스가 지정된 요소에 위에 올라간 상태 daum jokack01.tistory.com naver bobaedream nate

:active - 링크 선택자 : 활성화된 링크만 모두 선택 ex) a 태그를 클릭시 ( 예 : a:active ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 :active a:active{ background-color:yellow; } :active - 링크 선택자 활성화된 링크 선택 : 마우스가 클릭되서 떼기 전 까지의 상태 ~ daum jokack01.tistory.com naver bobaedream nate

:visited - 링크 선택자 : 방문된 링크만 모두 선택 ex) 방문된 링크들을 선택 ( 예 : a:visited ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 :visited a:visited{ color:green; } :visited - 링크 선택자 방문된 링크만 모두 선택 daum jokack01.tistory.com naver bobaedream nate

:link - 링크 선택자 : 모든 링크를 선택 ex) 모든 링크 선택 ( 예 : a:link ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 :link a:link{ background-color:yellow; } 링크 선택자 모든 링크를 선택 daum jokack01.tistory.com naver

[attribute|=language] - 속성 값 선택자 : 지정된 속성에 지정된 단어로 시작되는 요소를 모두 선택 ex) p 태그에 lang 속성이 en 으로 시작하는 요소를 모두 선택 ( 예 : [lang|=en] ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 [attribute|=language] [lang|=en]{ background:yellow; } 속성 값 선택자 지정된 속성에 지정된 단어로 시작되는 요소를 모두 선택 Hello! Hi! Ello! Hi! Hei!

attribute~=value - 속성 값 선택자 : 지정된 속성에 지정된 값이 포함된 요소를 모두 선택 ex) a태그에 title 속성값에 ho 단어가 포함된것들을 선택 ( 예 : [title~=ho] ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 [attribute~=value] [title~=ho]{ background:yellow; } 속성 값 선택자 지정된 속성에 지정된 값이 포함된 요소를 모두 선택 daum jokack01.tistory.com naver

[attribute=value] - 속성 값 선택자 : 지정된 속성의 값을 가진 요소를 모두 선택 ex) a 태그의 target 속성이 _blank 인것을 선택 ( 예 : a[target=_blank] ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 a[target=_blank] a[target=_blank]{ background-color:yellow; } 속성 값 선택자 지정된 속성의 값을 가진 요소를 모두 선택 daum jokack01.tistory.com naver

attribute - 속성 선택자 : 지정된 속성 가진 요소를 모두 선택 ex) 지정된 속성 가진 요소를 모두 선택 ( 예 : a[target] ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 [attribute] a[target] { background-color:yellow; } 속성 선택자 지정된 속성 가진 요소를 모두 선택 daum jokack01.tistory.com naver

element + element -인접 선택자 : 지정된 요소와 같은 레벨의 바로 다음 요소 선택 ex) div 가 끝난후 바로 다음에 나오는 p 요소만을 선택 ( 예 : div + p ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 element + element div + p { background-color:yellow; } 인접 선택자 지정된 요소와 같은 레벨의 바로 다음 요소 선택 test1 div 가 끝난후 바로 다음에 나오는 p 요소만을 선택 test2 test3

element>element - 자식 선택자 : 지정된 상위 요소 바로 아래의 지정된 하위 요소만 선택 ex) div 바로 다음에 나오는 p 요소들을 선택 ( 예 : div > p ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 element > element div > p { background-color:yellow; } 자식 선택자 지정된 상위 요소 아래의 지정된 하위 요소 선택 div 안에서 div 다음에 나오는 p 요소들의 집합을 선택한다. test1 test2 test3 test4