CSS é uma linguagem de estilo que consiste em muitos recursos distintos. Uma dessas características é que ele permite que seus usuários declarem propriedades personalizadas que também são chamadas de variáveis CSS. Essas variáveis consistem em nomes e valores específicos e, uma vez declarados, eles podem ser usados em qualquer lugar do arquivo. Para usar essas variáveis, o CSS fornece uma função pelo nome var () função que vamos discutir em detalhes nesta redação. Este post inclui os seguintes tópicos.
1. função var ()
2. Vantagens da função var ()
A função var () no CSS
Com o objetivo de incluir uma propriedade personalizada ou uma variável CSS que possa ser usada em outras partes da folha de estilo, a função var () é usada.
Sintaxe
var () = var (-Nome do Property, valor da propriedade)
Parâmetros explicados
nome da propriedade: Especifica o nome da propriedade personalizada. É um parâmetro necessário.
Valor da propriedade: Especifica o valor da propriedade personalizada. É um parâmetro opcional.
Pontos para lembrar!
1. As regras CSS definem que as variáveis CSS têm um escopo local ou global. Uma variável global pode ser usada em qualquer lugar do documento inteiro; Enquanto isso, uma variável local pode ser recuperada apenas pelo seletor em que é definido em.
2. Com o objetivo de criar uma variável global usando a função var (), ela deve ser declarada no: seletor de raiz
3. Enquanto isso, uma variável local pode ser criada dentro de qualquer seletor.
Exemplo 1
Suponha que você queira usar a função var () ao declarar variáveis globais.
Html
Este é um parágrafo.
No trecho de código acima, simplesmente criamos um recipiente de div e aninhados
div Cor: var (-azul); cor de fundo: var (-branco); preenchimento: 15px;
P cor de fundo: var (-branco); Cor: var (-azul); borda: 3px var (-marrom); preenchimento: 40px;
No código acima, definimos algumas variáveis globais no: seletor de raiz, cada um correspondente a uma cor específica. Em seguida, estamos usando essas variáveis globais em todo o documento, quando necessário, usando a função var (). A vantagem de criar essas variáveis globais e depois usá -las na função var () é que, nesse caso em particular, você não precisa definir cores de elementos repetidamente, apenas use a função var ().