[CSS]가상클래스 선택자

가상 클래스 선택자(Pseudo-Classes Selectors)

 

- hover

 : 마우스가 올라가 있는 동안에만 선택

E:hover {

}

 

- active

 : 마우스로 클릭하는 동안에만 선택

E:active {

}

 

- focus

 : 포커스 된 동안에만 선택

E:focus {

}

 

- first-child

 : E가 형제 요소 중 첫번째 요소라면 선택

.E li:first-child {

}

<ul class="E">
  <li></li> <!--첫번째 선택-->
  <li></li>
</ul>

반대 개념으로는 last-child

 

 

-nth-child

.E li:nth-child(2) {

}

 

<ul class="E">
  <li></li>
  <li></li> <!--선택-->
  <li></li>
</ul>

 

E li:nth-child(2n) 짝수선택

 

 

-nth-of-type

 

 

 

 

 

 

 

#패스트캠퍼스