이거는 어떻게 쓰냐면
:root {
--main-color: #8d140a;
--sub-color: #ac4404;
--back-color: #f7ce1b;
}
이런 식으로 :root에 색깔명을 할당하고
::selection {color:var(--main-color);
background-color:var(--back-color);}
그 할당한 색깔을 쓸 때는 var(이름) 이런 식으로 쓴다. (형식이 망한 이유는 워드프레스에 적용한거 통으로 갖고온거라… 에디터는 알아서 이쁘게 잡아줍니다 여러분)
보통 CSS에서는
* {color:#000000;}
이렇게 쓴다. 보통은 이렇게 쓰는데 문제가 뭐냐면, 이거는 나중에 색을 바꿀 때 일일이 요소별로 찾아서 바꿔야 한다. 그나마 색깔 코드가 통일된 게 있으면 찾아바꾸기 신공이라도 쓰면 되지만, 이런 요소가 많아지면 피곤하그덩… 근데 var는 이럴 때 :root에 있는 해당 색깔만 바꾸면 다 바뀌기때문에 편하다.
Reply