Eienskap outline-style

Die eienskap outline-style spesifiseer die styl van die buitelynraam - 'n grens wat geen spasie beslaan nie.

Sintaksis

cssselektor {
  outline-style: waarde;
}

Waarde	Beskrywing
`solid`	Ononderbroke lyn.
`dotted`	Raam as kolletjies.
`dashed`	Raam as strepies.
`ridge`	Raam as uitstaande lyn.
`double`	Raam as dubbel lyn. Om die effek te sien, moet die lynwydte minstens `3px` wees.
`groove`	Ingesinkte raam.
`inset`	Ingegraveerde raam.
`outset`	Uitstaande raam.
`none`	Geen grens nie.

Standaardwaarde: none.

html<div id="elem"></div>

css#elem {
  outline-width: 1px;
  outline-style: solid;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 1px;
  outline-style: dotted;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 1px;
  outline-style: dashed;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: ridge;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: double;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: groove;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: inset;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: outset;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат: