CSS 선택자, 결합자

선택자

• 기본 선택자
  -전체 선택자 *
  -요소 선택자 h2{ color: blue;}
  -클래스 선택자 .green{
  -아이디 선택자 #purple{
  -속성 선택자
  

결합자

1. 자식 결합자

.box > p {
	color: blue;
    }    

-> box 클래스의 p직계 자식 하나만

2. 자손 결합자

.box p {
	color: red;
    }

-> box 클래스의 p자손들 모두

3. 일반 형제 결합자
   selectA의 형제 요소 중 뒤에 위치하는 selectorB요소 모두

p ~ span{
	color: blue;
    }

4. 인접 형제 결합자
   A의 형제 요소 중 바로 뒤에 위치하는 B요소를 선택

p + span{
	color:blue;
    }


> 크기의 단위

1. em: 상속의 영향을 받음/ 배수단위, 요소에 지정된 사이즈에 상대적인 사이즈를 가짐.
2. rem: 상속 영향 받지 x/ 최상위 요소(html)의 사이즈를 기준으로 배수 단위를 가짐.