CSS Selectors 2

전체 선택자 (Universal selector)

전체 선택자는 * 로 표시되며 페이지 안의 모든 요소들을 선택할 때 사용된다.

주로 모든 요소에 공통적인 속성을 지정할 때, 사용된다.

*    { color : red; }

자손, 자식, 선택자

이들은 모두 선택자를 결합해서 특정한 요소를 선택한다.

특정한 요소의 후손을 선택할 수도 있고, 자식 요소만을 선택할 수도 있다.

expression	meaning
s1 s2	s1 요소에 포함된 s2 요소를 선택한다.  (descendant, 후손)
s1 > s2	s1 요소의 직계 자식 요소인 s2를 선택한다. (자식)

cf. 후손은 아들, 딸, 손자, 손녀 등이 모두 포함 되어있고, 자식은 아들, 딸만 포함된다.

의사 클래스 (psuedo-class)

의사 클래스는 콜론(:)을 사용하여 표기한다.

의사 클래스는 용어 그대로 클래스가 정의된 것처럼 간주한다는 것이다.

예를 들어 a:link 라면 <a>에 클래스 link가 선언된 것처럼 선택자를 만든다는 것이다.

        a:link { color : blue; }

        a:visited { color : red; }

        a:hover { color : green; }

속성 선택자 (attribute selector)

특정한 속성을 가지는 요소를 선택한다. 

예를 들어 다음은 title 속성을 가지고 있는 h1 요소만을 선택한다.

h1[title] { color: blue; }

다음은 class 속성이 "example"인 p 요소를 선택한다.

p[class = "example"] { color : blue; }