CSS의 사용자 지정 속성(CSS Custom properties) 설정하기

CSS의 프로퍼티를 사용하여 문서 전반적으로 재사용할 임의의 값을 담을 수 있다. 디폴트 값이나 반복적으로 사용되는 스타일의 경우 :root(문서 전체에 할당되는 css)에 선언한다. 변경되지 않는 값은 :root에 지정하여 사용하고, 국소적으로 사용되는 값의 경우에는 사용하는 위치에 선언하는 것을 권장한다.

• --변수명
  사용 시 var(--변수명)을 작성하여 사용이 가능하다.
  
  
• CSS Custom properties 작성방법
  1. 대소문자를 구분한다. CamelCase 기법 사용가능
  2. 특수문자 사용 불가능 (@,^,& 등)

 

See the Pen css custom properties by coding-ji (@coding-ji) on CodePen.