CSS의 변수 - 왜 사용할 수 없습니까?

Question

꽤 당황스럽고 어디서나 답변을 찾을 수 없습니다 : 왜 순수 CSS가 변수를 사용할 수 있습니까?

우리 모두는 SASS 및 LESS 전처리기에 대해 알고 있습니다. 예를 들어 변수를 사용하는 등 일상 생활을 훨씬 쉽게 만듭니다. W3C가 아직 CSS 자체에서 그러한 기능을 구현하지 못한 특별한 이유가 있습니까?

나는 모든 개발자 (W3C의 개발자들도)가 큰 발전을 이룰 것이라고 생각한다. 아직 취하지 않은 특별한 이유가 있습니까? http://caniuse.com/css-variables/embed

당신은/CSS를 변수로 시작해야 할 수 있습니다 ..

Answer 1

내 연구 결론적으로 :

을 당신은 T로 SASS 이하를 사용할 필요가 없습니다 CSS에서 변수의 장점.

CSS에서 재사용 가능한 값을 설정하려면 사용자 지정 속성 표기법 (예 : --main-color: black;

그런 다음 var() 함수를 사용하여 스타일 파일의 아무 곳이나 액세스 할 수 있습니다. 아래 color: var(--main-color);

근무 예 :

:root { 
 
    --main-theme-color: red; 
 
} 
 

 
.one { 
 
    background-color: var(--main-theme-color); 
 
    margin: 10px; 
 
    width: 50px; 
 
    height: 50px; 
 
} 
 

 
.two { 
 
    background-color: var(--main-theme-color); 
 
    margin: 10px; 
 
    width: 50px; 
 
    height: 50px; 
 
} 
 
.three { 
 
    background-color: var(--main-theme-color); 
 
    margin: 10px; 
 
    width: 50px; 
 
    height: 50px; 
 
} 
 
.four { 
 
    background-color: black; 
 
    color: var(--main-theme-color); 
 
    margin: 10px; 
 
    width: 50px; 
 
    height: 50px; 
 
}

<div class="one"> </div> 
 
<div class="two"> </div> 
 
<div class="three"> </div> 
 
<div class="four"> RED </div>

Answer 2

아니라 사양이라고 지정 속성 https://www.w3.org/TR/css-variables-1/

하지만 지원은 지금 문제의 비트입니다 ..하지만이있다 https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables