CSS omtrekkleur Eigenschap
Voorbeeld
Stel een kleur in voor de omtrek:
div {outline-color: coral;}
Meer "Probeer het zelf" voorbeelden hieronder.
Definitie en gebruik
Een omtrek is een lijn die om elementen wordt getrokken, buiten de grenzen, om het element te laten "opvallen".
De outline-color
eigenschap specificeert de kleur van een omtrek.
Opmerking: Declareer de eigenschap outline-stijl altijd vóór de
outline-color
eigenschap. Een element moet een omtrek hebben voordat u de kleur ervan kunt wijzigen.
Standaardwaarde: | omkeren indien ondersteund, anders huidige kleur |
---|---|
geërfd: | Nee |
Animeerbaar: | ja, zie individuele eigenschappen . Lees over animeren |
Versie: | CSS2 |
JavaScript-syntaxis: | object .style.outlineColor="#FF0000" |
Tips en opmerkingen
Let op: Omtreklijnen verschillen van randen ! In tegenstelling tot de rand wordt de omtreklijn buiten de rand van het element getekend en kan deze andere inhoud overlappen. Ook maakt de omtrek GEEN deel uit van de afmetingen van het element; de totale breedte en hoogte van het element wordt niet beïnvloed door de breedte van de omtrek.
Browserondersteuning
De getallen in de tabel geven de eerste browserversie aan die de eigenschap volledig ondersteunt.
Property | |||||
---|---|---|---|---|---|
outline-color | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
Opmerking: de waarde invert
wordt in geen enkele browser ondersteund, behalve in Internet Explorer 8.
CSS-syntaxis
outline-color: invert|color|initial|inherit;
Eigendomswaarden
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 |
Meer voorbeelden
Voorbeeld
Stel een kleur in voor de omtrek met een HEX-waarde:
div {outline-color: #92a8d1;}
Voorbeeld
Stel een kleur in voor de omtrek met een RGB-waarde:
div {outline-color: rgb(201, 76, 76);}
Voorbeeld
Stel een kleur in voor de omtrek met een RGBA-waarde:
div {outline-color: rgba(201, 76, 76, 0.3);}
Voorbeeld
Stel een kleur in voor de omtrek met een HSL-waarde:
div {outline-color: hsl(89, 43%, 51%);}
Voorbeeld
Stel een kleur in voor de omtrek met een HSLA-waarde:
div {outline-color: hsla(89, 43%, 51%, 0.3);}
Gerelateerde pagina's
CSS-zelfstudie: CSS-overzicht
CSS-referentie: overzichtseigenschap
HTML DOM-referentie: eigenschap outlineColor