반응형 :root1 [HTML/CSS] :root를 통해 CSS에서 변수를 사용해 보자 : 가상 클래스의 활용 CSS를 통해 디자인을 하는 과정에서 페이지의 통일성을 위해 하나의 값을 여러 번 활용하는 경우가 많다. 이러한 경우 :root 가상 클래스를 활용하여 변수를 생성함으로써 코드의 유지·보수나 추가적인 확장을 쉽게 할 수 있다. 아래의 예시를 보자. See the Pen Untitled by me_in_sk (@sleepyMS) on CodePen. :root 변수의 선언 변수의 이름 앞에는 --(하이픈 2개)를 붙여준다. :root { --width: 200px; --height: 100px; --box-color: #a6a5ff; --box-font-weight: bold; --box-font-size: 20px; } :root 변수의 적용 var() 함수를 통해 괄호 안에 적용할 변수를 입력한다. ... 2023. 6. 25. 이전 1 다음 반응형
