Maison > Article > interface Web > Que signifie var en CSS ?
La fonction var() en CSS fournit des fonctions de stockage et d'utilisation des variables, attribuant des valeurs aux variables et les utilisant dans toute la feuille de style. Utilisation : 1. Utilisez le préfixe -- pour déclarer la variable (--
: ); 2. Utilisez la fonction var() pour obtenir la valeur de la variable (var(-- ;) ). Utilisez var() pour la réutilisabilité, la cohérence et la facilité de maintenance, et pour créer des valeurs qui s'ajustent en fonction des requêtes multimédias ou des variables JavaScript.
Qu'est-ce que var en CSS ?
La fonction var()
en CSS vous permet de stocker et d'utiliser des variables. Il vous permet d'attribuer une valeur à une variable, puis de réutiliser cette variable dans votre feuille de style. 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()
, veuillez suivre ces étapes : 🎜--
déclaration Une variable CSS. La syntaxe est : --<Variable name> : <Value>;
🎜var()
pour obtenir la valeur de la variable. La syntaxe est : var(--<Variable name>);
🎜--primary- color
et définissez-la sur bleu : 🎜rrreee🎜 Vous pouvez ensuite utiliser cette variable dans d'autres parties de votre feuille de style : 🎜rrreee🎜🎜 Avantages 🎜🎜🎜 L'utilisation de variables CSS présente de nombreux avantages, notamment : 🎜 var()
pour créer des valeurs dynamiques, telles que le redimensionnement ou la coloration en fonction de requêtes multimédias ou de variables JavaScript. 🎜🎜🎜🎜Note🎜🎜var(--var-1)
. 🎜var()
ne prend pas en charge les expressions de calcul, telles que var(--var-1 + var(--var-2))
. 🎜🎜Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!