CSS var() Funzione
❮ Riferimento alle funzioni CSS
Esempio
Per prima cosa, dichiara una variabile globale denominata "--main-bg-color", quindi usa la funzione var() per inserire il valore della variabile più avanti nel foglio di stile:
:root {
--main-bg-color: coral;
}
#div1 {
background-color: var(--main-bg-color);
}
#div2 {
background-color: var(--main-bg-color);
}
Altri esempi "Provalo da solo" di seguito.
Definizione e utilizzo
La funzione var() viene utilizzata per inserire il valore di una variabile CSS.
Versione: | CSS3 |
---|
Supporto del browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente la funzione.
Function | |||||
---|---|---|---|---|---|
var() | 49.0 | 15.0 | 31.0 | 9.1 | 36.0 |
Sintassi CSS
var(--name, value)
Value | Description |
---|---|
name | Required. The variable name (must start with two dashes) |
value | Optional. The fallback value (used if the variable is not found) |
Altri esempi
Esempio
Un altro esempio che utilizza la funzione var() per inserire diversi valori di variabili CSS:
:root {
--main-bg-color: coral;
--main-txt-color: blue;
--main-padding: 15px;
}
#div1 {
background-color: var(--main-bg-color);
color: var(--main-txt-color);
padding: var(--main-padding);
}
#div2 {
background-color: var(--main-bg-color);
color: var(--main-txt-color);
padding: var(--main-padding);
}
Pagine correlate
Tutorial CSS: variabili CSS
❮ Riferimento alle funzioni CSS