Front/CSS

[CSS] !important

오선지♬ 2022. 3. 24. 08:03
728x90
반응형

CSS는 같은 속성을 여러번 정의하게 되면, 나중에 설정한 값이 적용된다.

 

만약 나중에 설정한 값이 적용되지 않아야 한다면 

 

속성값 뒤에 !important 를 붙여준다.

 

프로젝트를 하다보면 css파일도 많아지고 추가하게되면서 같은 속성을 정의하게 되어

 

내가 원하는 효과가 나오지 않을 때가 있는데,

 

너무 남발하면 안되겠지만 중요한 곳에 적어두면 되겠다.

 

먼저  !important를 적어놓았어도 나중에 정의한 값에도 !important를 붙이면 나중에 설정한 값으로 바뀐다 

 

ex)

 

<style>

            p{
                background-color : red !important;
                float : left;                    
            }
 
            p{
                background-color : blue;
                float : left
            }
 
            p{
                background-color : green !important;
                float : left
            }
        </style>
 
결과 : 초로색 배경으로 출력.
 
 

 

 

728x90
반응형

'Front > CSS' 카테고리의 다른 글

[CSS] div 가로 정렬하기 - flex  (0) 2022.04.30
[CSS] div 가로 정렬 하기 -float  (0) 2022.04.05
[CSS] position 속성  (0) 2022.03.27
[CSS] outline-offset  (0) 2022.03.25
[CSS] overflow 속성  (0) 2022.03.22