HTML + CSS

[HTML + CSS] CSS 우선 순위

그러하게 2019. 4. 8. 10:03

CSS 우선 순위

1. !important

2. inline으로  style 지정

3. ID

4. class, pseudo-class

5. 선택자가 태그이름

6. 상위 객체의 상속된 속성

※ 우선 순위가 같은 우선 순위의 경우 CSS가 나중에 선언한 것인 우선 적용

 

 

1. !important

    .class {

              background-color: red !important; 

      }

 

2. inline 으로 style 지정

     <div id="id" class="class" sytle="background-color: red;">

                 <p>inline으로 지정한 경우</p>

      <div>

 

3. ID 

     #ID {

           background-color: red; 

      }

 

4. class, pseudo-class

      .class {

             background-color: red; 

      }

 

5. 선택자 태그 이름

       div a {

               background-color: red;

        }

 

6. 상위객체의 상속된 속성 : 생략