CSS rand-stijl eigenschap

Definitie en gebruik

De outline-style-eigenschap wordt gebruikt om de stijl van de hele contour van het element in te stellen. De stijl kan geen none zijn, anders zal de contour niet verschijnen.

Outline (contouren) is een lijn die wordt getekend rond het element, buiten de rand van de rand, en kan de functie van het benadrukken van het element uitvoeren. De eigenschap outline stelt de contouren rond het element in.

Opmerking:De eigenschap outline-style moet altijd voor de eigenschap outline-color worden verklaard. Een element kan alleen de kleur van de contouren wijzigen nadat het een contouren heeft verkregen.

Opmerking:Contourenlijnen nemen geen ruimte in beslag en hoeven niet altijd rechthoekig te zijn.

Zie ook:

CSS tutorial:CSS profiel

CSS referentiemanual:outline eigenschap

HTML DOM referentiemanual:outlineStyle eigenschap

Voorbeeld

Stijl van de contouren instellen:

p
  {
  outline-style:dotted;
  }

Probeer het zelf

CSS syntaxis

outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

Eigenschapswaarde

Waarde Beschrijving
geen Standaard. Definieert geen contouren.
hidden Definieert een verborgen contouren.
dotted Definieert een puntenlijncontouren.
dashed Definieert een gestippelde lijncontouren.
solid Definieert een gestrekte lijncontouren.
double Definieert een dubbele lijncontouren. De breedte van de lijnen is gelijk aan de waarde van outline-width.
groove Definieert een 3D inkepinggleufcontouren. Dit effect hangt af van de waarde van outline-color.
ridge Definieert een 3D bolle gleufcontouren. Dit effect hangt af van de waarde van outline-color.
inset Definieert een 3D inkepingcontouren. Dit effect hangt af van de waarde van outline-color.
outset Definieert een 3D bolle randcontouren. Dit effect hangt af van de waarde van outline-color.
inherit De instelling van de contourenstijl moet van de ouder-eigenschap worden geërfd.

Technische details

Standaardwaarde: geen
Inheritsbaarheid: nee
Versie: CSS2
JavaScript syntaxis: object.style.outlineStyle="dotted"

TIY voorbeeld

Stijl van de contouren instellen
Dit voorbeeld demonstreert hoe je de stijl van de contouren instelt.

Browserondersteuning

De cijfers in de tabel vermelden de eerste browserversie die de eigenschap volledig ondersteunt.

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.5 1.2 7.0

Opmerking:Als !DOCTYPE is gedefinieerd, ondersteunt IE8 de outline-eigenschap.