Proprietà CSS colore contorno
Esempio
Imposta un colore per il contorno:
div {outline-color: coral;}
Altri esempi "Provalo da solo" di seguito.
Definizione e utilizzo
Un contorno è una linea che viene tracciata attorno agli elementi, al di fuori dei bordi, per far "saltare" l'elemento.
La outline-color
proprietà specifica il colore di un contorno.
Nota: dichiarare sempre la proprietà dello stile del contorno prima della
outline-color
proprietà. Un elemento deve avere un contorno prima di cambiarne il colore.
Valore di default: | invert se supportato, altrimenti currentcolor |
---|---|
Ereditato: | no |
Animabile: | sì, vedi singole proprietà . Leggi su animabile |
Versione: | CSS2 |
sintassi JavaScript: | oggetto .style.outlineColor="#FF0000" |
Suggerimenti e note
Nota: i contorni differiscono dai bordi ! A differenza del bordo, il contorno viene disegnato al di fuori del bordo dell'elemento e può sovrapporsi ad altri contenuti. Inoltre, il contorno NON fa parte delle dimensioni dell'elemento; la larghezza e l'altezza totali dell'elemento non sono influenzate dalla larghezza del contorno.
Supporto browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente la proprietà.
Property | |||||
---|---|---|---|---|---|
outline-color | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
Nota: il valore invert
non è supportato in nessun browser, ad eccezione di Internet Explorer 8.
Sintassi CSS
outline-color: invert|color|initial|inherit;
Valori di proprietà
Value | Description | Play it |
---|---|---|
invert | Performs a color inversion. This ensures that the outline is visible, regardless of color background. Note: Browsers are not required to support this value. | |
color | Specifies the color of the outline. Look at CSS Color Values for a complete list of possible color values. | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Altri esempi
Esempio
Imposta un colore per il contorno con un valore HEX:
div {outline-color: #92a8d1;}
Esempio
Imposta un colore per il contorno con un valore RGB:
div {outline-color: rgb(201, 76, 76);}
Esempio
Imposta un colore per il contorno con un valore RGBA:
div {outline-color: rgba(201, 76, 76, 0.3);}
Esempio
Imposta un colore per il contorno con un valore HSL:
div {outline-color: hsl(89, 43%, 51%);}
Esempio
Imposta un colore per il contorno con un valore HSLA:
div {outline-color: hsla(89, 43%, 51%, 0.3);}
Pagine correlate
Tutorial CSS: Schema CSS
Riferimento CSS: proprietà outline
Riferimento HTML DOM: proprietà outlineColor