content 속성의 값에 CSS 사용자 정의 속성을 사용할 수 있습니까?

Question

예 : 다음의 렌더링

:root { 
    --PrimaryThemeColor: #3acfb6; /* with or without quotes */ 
} 

.ColorSwatch:after { 
    content: var(--PrimaryThemeColor); 
} 

, 계산 된 CSS 그대로 그 값이다. 내가 대체로 계산 된 값을 주입 후 프로세서를 사용하고 있더라도

content: var(--PrimaryThemeColor); 

, 값 자체가 문자열이 아닌, 그래서 content에 대해 유효합니다.

.ColorSwatch:after { 
    content: #3acfb6; 
    content: var(--PrimaryThemeColor); 
} 

Answer 1

커스텀 속성의 값은 대응 var() 표현 순서 (리터럴 스트링 attr() 식 또는 content의 경우 임의의 수의 임의의 조합이 토큰은 상기 하나) 스트링이어야 문자열이 예상되는 곳이면 어디서든 올바르게 작동합니다.

var() 함수를 통해 문자열이 아닌 값을 문자열로 변환하거나 임의의 두 데이터 유형간에 변환 할 수 없습니다. 값은 항상 파싱되고, 그대로 저장되며, 값은 임의의 수의 토큰으로 구성 될 수 있으므로 데이터 유형 간의 변환은 매우 어려울 것입니다.