English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Ci sono diversi metodi per definire valori di colore in CSS.
Le chiavi di colore sono identificatori senza distinzione tra maiuscole e minuscole che rappresentano un colore specifico, ad esempio red, green, blue, yellow, black, ecc.
h1 {
color: red;
}
p {
background-color: yellow;
}Prova a vedere < / >Attenzione:Il supporto per le chiavi di colore varia a seconda del browser, quindi per sicurezza è meglio utilizzare esadecimali o simboli funzionali.
VisualizzaChiave di coloreelenco completo
La chiave transparente rappresenta un colore completamente trasparente.
Questa chiave può essere considerata una abbreviazione del nero trasparente rgba(0,0,0,0), ed è anche il suo valore calcolato.
h1 {
color: transparent;
}
p {
background-color: transparent;
}Prova a vedere < / >Attenzione: CSS 2.1 permette solo due attributi:background-coloreborder-colorAccetta la parola chiave transparente. Tuttavia, CSS3 ha esteso i valori dei colori per includere la parola chiave transparente, permettendo il suo utilizzo con tutti gli attributi che accettano valori di colore.
Il modello di colore RGB (rosso, verde, blu) è il metodo più comune utilizzato per definire i valori dei colori nel CSS. È possibile definire i colori utilizzando il modello RGB in due modi:
Quando si utilizza il simbolo a sei cifre (#rrggbb), la prima coppia (rr) rappresenta il valore del rosso, la seconda coppia (gg) rappresenta il valore del verde, e l'ultima coppia (bb) rappresenta il valore del blu.
color: #f80;
h1 {
background-color: #ff8800;
}
p {
Suggerimento:
}Prova a vedere < / >La notazione esadecimale a tre cifre (#rgb) può essere convertita in una forma a sei cifre copiando i numeri anziché aggiungere zero. Ad esempio: #03f può essere espanso a #0033ff, ma entrambi i valori rappresentano lo stesso colore.Notazione funzionale
Notazione funzionale
Il valore intero 255 corrisponde al 100%, la notazione esadecimale f o ff: ad esempio, rgb(0,255,255) = rgb(0%,100%,100%) = #0ff, tutti i valori rappresentano lo stesso colore, ovvero aqua. E' permessa la presenza di spazi intorno ai valori numerici.
h1 {
color: rgb(0,255,255);
}
p {
background-color: rgb(0%,100%,100%);
}Prova a vedere < / >Il valore 0 o 0% rappresenta l'assenza di un valore di colore specifico, mentre i valori 255, 100% e f o ff rappresentano la presenza completa del valore di colore.
Attenzione:I valori al di fuori dell'intervallo validato (0-255 o 0%-100%) vengono troncati automaticamente o modificati nel range supportato dal dispositivo.
Vedi相关信息Colori CSS3Le istruzioni, per conoscere i nuovi simboli di funzione (ad esempio) rgba(), hsl() e hsla() utilizzati per definire le informazioni sui valori dei colori.