고정 헤더 영역
상세 컨텐츠
본문
:root
CSS :root 의사 클래스는 문서 트리의 루트 요소를 선택합니다 HTML의 루트 요소는 html 요소이므로, :root의 명시도가 더 낮다는 점을 제외하면 html 선택자와 똑같습니다.
developer.mozilla.org
- :root는 전역 css 변수를 선언하기에 용이하다.
:root {
--base: #ffc600;
--spacing: 10px;
--blur: 10px;
}
img {
padding: var(--spacing);
background: var(--base);
filter: blur(var(--blur));
}
.hl {
color: var(--base);
}:root{}안에서 원하는 변경을 하면, var(--~~~)를 사용하는 애들의 값도 한번에 변경된다.
댓글 영역