CSS공통 Style 의 선택자 종류 (CSS 정보)

황제낙엽 2009.06.25 11:25 조회 수 : 52 추천:136

sitelink1  
sitelink2  
sitelink3  
sitelink4  
extra_vars5  
extra_vars6  

1. 기본구조 : selector { property : value; }  ->  선택자 { 속성 : 값; } 
  

2. selectors ( http://css.maxdesign.com.au/selectutorial/ 참조) 
 1) 클래스 선택자 (Class Selectors) : .class선택자가 선언된 모든 태그에 대하여 style을 
  적용한다.
   .big { font-size: 110%; font-weight: bold; }
   div.big { color: blue; }
   td.big { color: yellow; }
   label.big { color: green; }
   form.big { color: red; }
  
 2) 아이디 선택자 (Id Selectors) : 해당되는 아이디에 해당되는 태그에만 style을 적용한다.
   #navigation { width: 12em; color: #333; }
   div#navigation { width: 12em; color: #333; }
  
 3) 의사클래스 (Pseudo Classes) :
   a:visited {}
   a:hover {}
   a:link, a:visited { color: blue; }
   a:hover, a:active { color: red; }
  
 4) 문맥선택자 (Descendant Selectors) : UL OL EM { color : gray; }
  예제와 같은 경우 <UL><OL><EM></EM></OL></UL>의 형태에 대해서만
  color:gray선언이 적용된다.
  
 5) 자식선택자 (Child Selectors) 
  div > em { color: blue; }
  OR
  div>em { color: blue; }
  
 6) 타입 선택자 (Type Selectors) : 기본형 - 이것은 XAE에서 기본 정의되는 엘리먼트 Type에 
  해당할 것이다.
   em {color: blue; }
  
 7) 전체 선택자 (Universal Selectors) : 모든 타입에 대하여 적용한다.
  * {color: blue; }
  
3. declaration 
 property:value 구문의 끝에는 항상 세미콜론(;) 으로 종결한다. 
  
4. 주석문 (무조건 무시한다) 
 -    /*     */ 형태