⌘K

Egenskapen outline-style

Egenskapen outline-style angir stilen på den ytre rammen - en grense som ikke tar opp plass.

Syntaks

cssvelger {
  outline-style: verdi;
}

Verdier

Verdi Beskrivelse
solid Hel linje.
dotted Ramme som prikker.
dashed Ramme som streker.
ridge Ramme som en opphøyd linje.
double Ramme som en dobbel linje. For å se effekten må rammetykkelsen være minst 3px.
groove Innskåret ramme.
inset Innsenket ramme.
outset Opphøyd ramme.
none Ingen ramme.

Standardverdi: none.

Eksempel . Verdien solid

html<div id="elem"></div>
css#elem {
  outline-width: 1px;
  outline-style: solid;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

Eksempel . Verdien dotted

html<div id="elem"></div>
css#elem {
  outline-width: 1px;
  outline-style: dotted;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

Eksempel . Verdien dashed

html<div id="elem"></div>
css#elem {
  outline-width: 1px;
  outline-style: dashed;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

Eksempel . Verdien ridge

html<div id="elem"></div>
css#elem {
  outline-width: 3px;
  outline-style: ridge;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

Eksempel . Verdien double

html<div id="elem"></div>
css#elem {
  outline-width: 3px;
  outline-style: double;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

Eksempel . Verdien groove

html<div id="elem"></div>
css#elem {
  outline-width: 3px;
  outline-style: groove;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

Eksempel . Verdien inset

html<div id="elem"></div>
css#elem {
  outline-width: 3px;
  outline-style: inset;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

Eksempel . Verdien outset

html<div id="elem"></div>
css#elem {
  outline-width: 3px;
  outline-style: outset;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

Se også

BackEgenskapen outline-widthNextEgenskapen outline-color