728x90
이번 시간에는 속성값 적용 순위를 우선적으로 변경하는
!important 속성에 대해서 알아보겠습니다.
문법
property: value !important;
CSS는 같은 속성을 여러 번 정의했을 때, 나중에 설정한 값이 적용됩니다.
만약 나중에 설정한 값이 적용되지 않게 하려면 먼저 설정한 속성값 뒤에 !important를 붙여주어야 합니다.
예문
1. 글자의 색상은 가장 마지막에 설정한
blue 색상을 따라가기 때문에 파란색 적용됩니다.
p {
color: red;
}
p {
color: green;
}
p {
color: blue;
}
2. 글자의 색을 빨간색으로 설정하고 싶다면
red 속성 뒤에 important를 추가해 줍니다.
p {
color: red !important;
}
p {
color: green;
}
p {
color: blue;
}
3. 초록색 글자로 적용하려면 추가적으로
green 속성에 important 를 추가해 줍니다.
p {
color: red !important;
}
p {
color: green !important;
}
p {
color: blue;
}
반응형
그리드형
'IT > HTML & CSS & JavaScript' 카테고리의 다른 글
[CSS] 마우스 hover / 이미지 확대 2가지 방법 (1) | 2021.09.17 |
---|---|
[CSS] 가상요소(before), 가상클래스(hover) 사용법 (0) | 2021.09.16 |
[CSS] 기초 문법 (선택자, 속성, 값) (0) | 2021.09.16 |
[CSS] 배경색만 투명하게 만들기 (RGB) (0) | 2021.09.16 |
[CSS] 투명도 조절 방법 (opacity) (0) | 2021.09.16 |
댓글