class / id 선택자 우선순위 (헷갈려 !!)

-한 속성에 대해 여러개의 class가 있다면 우선적으로 적용되는 것은 나중에 오는 것이다

 ex) <h1 class="a-class another-class"> Hello </h1>

 

.a-class {

  color: green;

}

 

.another-class {

  color: blue;

}

 

=> 이 경우에 우선적으로 적용되는 것은? 더 나중에 적힌 코드인 another-class이다. blue 적용 !

 

-id가 class보다 우선적용

ex) <h1  class="a-class" id="an-id">Hello</h1>

 

.a-class {

  color: blue;

}

 

#an-id {

color: green;
}

 

=> 이 경우에 우선적으로 적용되는 것은? id 선택자인 후자의 것이다. green 적용!