CSS -omtrekstyl Eiendom
Voorbeeld
Stel 'n styl vir die buitelyn:
div {outline-style: dotted;}
Meer "Probeer dit self" voorbeelde hieronder.
Definisie en gebruik
'n Buitelyn is 'n lyn wat om elemente, buite die grense, getrek word om die element te laat "uitstaan".
Die outline-style
eiendom spesifiseer die styl van 'n buitelyn.
Standaard waarde: | geen |
---|---|
Geërf: | geen |
Animateerbaar: | geen. Lees oor animeerbaar |
Weergawe: | CSS2 |
JavaScript-sintaksis: | voorwerp .style.outlineStyle="dashed" |
Wenke en notas
Let wel: Buitelyne verskil van grense ! Anders as grens, is die buitelyn buite die element se grens geteken, en kan ander inhoud oorvleuel. Die buitelyn is ook NIE deel van die element se afmetings nie; die element se totale breedte en hoogte word nie deur die breedte van die buitelyn beïnvloed nie.
Blaaierondersteuning
Die nommers in die tabel spesifiseer die eerste blaaierweergawe wat die eiendom ten volle ondersteun.
Property | |||||
---|---|---|---|---|---|
outline-style | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
CSS-sintaksis
outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;
Eiendomswaardes
Value | Description | Play it |
---|---|---|
none | Specifies no outline. This is default | |
hidden | Specifies a hidden outline | |
dotted | Specifies a dotted outline | |
dashed | Specifies a dashed outline | |
solid | Specifies a solid outline | |
double | Specifies a double outliner | |
groove | Specifies a 3D grooved outline. The effect depends on the outline-color value | |
ridge | Specifies a 3D ridged outline. The effect depends on the outline-color value | |
inset | Specifies a 3D inset outline. The effect depends on the outline-color value | |
outset | Specifies a 3D outset outline. The effect depends on the outline-color value | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Meer voorbeelde
Voorbeeld
'n Gestreepte uiteensetting:
div {outline-style: dashed;}
Voorbeeld
'n Soliede uiteensetting:
div {outline-style: solid;}
Voorbeeld
'n Dubbele uiteensetting:
div {outline-style: double;}
Voorbeeld
'n Groef-omtrek:
div {
outline-style:
groove;
outline-color: coral;
outline-width: 7px;
}
Voorbeeld
'n Rif uiteensetting:
div {
outline-style:
ridge;
outline-color: coral;
outline-width: 7px;
}
Voorbeeld
'n Ingeboude uiteensetting:
div {
outline-style:
inset;
outline-color: coral;
outline-width: 7px;
}
Voorbeeld
'n Kort uiteensetting:
div {
outline-style:
outset;
outline-color: coral;
outline-width: 7px;
}
Voorbeeld
Stel die styl van 'n buitelyn deur verskillende waardes te gebruik:
p.a {outline-style: dotted;}
p.b {outline-style: dashed;}
p.c {outline-style: solid;}
p.d {outline-style: double;}
p.e {outline-style: groove;}
p.f {outline-style: ridge;}
p.g {outline-style: inset;}
p.h {outline-style: outset;}
Verwante bladsye
CSS handleiding: CSS Outline
CSS verwysing: uiteensetting eiendom
HTML DOM verwysing: outlineStyle eiendom