[CSS] css 변수 선언과 적용

css변수

• 사용자 지정 속성
• 사용자가 정의하는 속성과 값으로 재사용할 수 있는 임의값
• 공통으로 사용되는 값에 css변수를 설정하여 코드의 반복 사용 줄임

---

전역 선언 방법

:root { --variable--name: value; }

:root { --variable: value; }

---

지역 선언 방법

dt { --variable-name: value; }

지정된 요소와 하위 요소에서만 적용, 전역 선언된 변수와 이름이 같아도 상관 없으며 해당 지역에서는 지역 선언 변수가 우선 적용 됨.

---

적용

property: var(--variable--name);

property: var(--variable--name, fallback);