요즘 웹 사이트들이 사용자의 편의성을 위해서 웹 화면의 모드 변경(*다크 모드) 기능을 제공하고 있습니다. 또는 하나의 프로토타입 구조에 마크업이나 별도의 구조 변경 없이 컬러 값, 배경색의 변경을 통해서 다양한 테마형태로 전혀 다른 분위기의 화면을 연출하고 싶은 경우도 생기게 됩니다. 이를 CSS로 제어하기 위해서 모든 태그에 적용되는 CSS에 해당 테마에 맞는 컬러 값을 정의하는 것은 매우 힘든 작업이 됩니다. 이를 조금은 효율적으로 활용하기 위한 방법을 공유합니다. 그것은 :root 속성을 활용하는 방법입니다. CSS의 :root는 문서 트리의 루트 요소를 선택합니다. HTML의 루트 요소는 요소 선택자를 나타냅니다. :root { background: yellow; } CSS의 :root 선택자에..
