CSS의 var() 함수는 변수 저장 및 사용 기능을 제공하여 변수에 값을 할당하고 이를 스타일시트 전체에서 사용합니다. 사용법: 1. -- 접두어를 사용하여 변수를 선언합니다. (--: ) 2. var() 함수를 사용하여 변수 값을 얻습니다(var(--). ;) ). 재사용성, 일관성 및 유지 관리 용이성을 위해 var()를 사용하고 미디어 쿼리 또는 JavaScript 변수를 기반으로 조정되는 값을 생성합니다.
CSS에서 var는 무엇인가요?
CSS의 var()
함수를 사용하면 변수를 저장하고 사용할 수 있습니다. 이를 통해 변수에 값을 할당한 다음 스타일시트 전체에서 해당 변수를 재사용할 수 있습니다. var()
函数允许你存储和使用变量。它让你可以将值分配给变量,然后在整个样式表中重复使用该变量。
如何使用 var
要使用 var()
,请按照以下步骤操作:
--
前缀声明一个 CSS 变量。语法为:--<变量名>: <值>;
var()
函数来获取变量的值。语法为:var(--<变量名>);
示例
例如,以下代码声明了一个名为 --primary-color
的变量,并将其设置为蓝色:
<code class="css">:root { --primary-color: blue; }</code>
然后,你可以在样式表的其他部分使用此变量:
<code class="css">.heading { color: var(--primary-color); }</code>
优点
使用 CSS 变量有很多优点,包括:
var()
函数来创建动态值,例如根据媒体查询或 JavaScript 变量调整大小或颜色。注意
var(--var-1)
。var()
函数不支持计算表达式,例如 var(--var-1 + var(--var-2))
var()
을 사용하려면 다음 단계를 따르세요. 🎜--
접두사 사용 선언 CSS 변수입니다. 구문은 다음과 같습니다. --<변수 이름>: <값>;
🎜var()
함수를 사용하여 값을 가져옵니다. 변하기 쉬운. 구문은 다음과 같습니다. var(--<변수 이름>);
🎜--primary-라는 변수를 선언합니다. color
를 선택하고 파란색으로 설정하세요: 🎜rrreee🎜 그런 다음 스타일시트의 다른 부분에서 이 변수를 사용할 수 있습니다: 🎜rrreee🎜🎜 장점 🎜🎜🎜 CSS 변수를 사용하면 다음과 같은 많은 장점이 있습니다. 🎜 var()
함수를 사용하여 미디어 쿼리 또는 JavaScript 변수를 기반으로 크기 조정이나 색상 지정과 같은 동적 값을 생성할 수 있습니다. 🎜🎜🎜🎜Note🎜🎜var(--var-1)
과 같은 중첩 변수를 사용할 수 있습니다. 🎜var()
함수는 var(--var-1 + var(--var-2))
와 같은 계산 표현식을 지원하지 않습니다. 🎜🎜위 내용은 CSS의 var는 무엇을 의미합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!