Mehr "Try it Yourself" Sie "Try it Yourself" Beispiele unten.
Definition und Verwendung
Ein Entwurf ist eine Linie, die sich um Elemente gezogen wird (outside the borders) das Element zu machen "stand out" .
Der Umriss-Stil-Eigenschaft gibt den Stil eines Umrisses.
| Standardwert: | none |
|---|---|
| Vererbt: | no |
| Anima: | no. Read about animatable |
| Version: | CSS2 |
| JavaScript-Syntax: | object .style.outlineStyle="dashed" Try it |
Tipps und Hinweise
Ein Entwurf ist eine Linie, um ein Element. Es wird um den Rand des Elements angezeigt. Allerdings unterscheidet es sich von der Grenze Eigenschaft.
Der Umriss ist kein Teil der Dimensionen des Elements, also die Breite und Höhe des Elements Eigenschaften enthalten nicht die Breite der Kontur.
Browser-Unterstützung
Die Zahlen in der Tabelle geben Sie die erste Browser-Version, die die Eigenschaft vollständig unterstützt.
| Eigentum | |||||
|---|---|---|---|---|---|
| outline-style | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
Note: IE8 unterstützt die outline-style - Eigenschaft nur , wenn ein DOCTYPE angegeben ist!.
CSS-Syntax
outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;Eigenschaftswerte
| Wert | Beschreibung | Spiel es |
|---|---|---|
| none | Gibt keine Kontur. Dies ist die Standardeinstellung | Spiel es " |
| hidden | Gibt eine versteckte Kontur | Spiel es " |
| dotted | Gibt einen gepunkteten Umriss | Spiel es " |
| dashed | Gibt eine gestrichelte Kontur | Spiel es " |
| solid | Gibt eine feste Kontur | Spiel es " |
| double | Gibt ein Doppel Outliner | Spiel es " |
| groove | Gibt eine 3D-gerillten Kontur. Die Wirkung ist abhängig von der Kontur-Farbwert | Spiel es " |
| ridge | Gibt eine 3D geriffelte Kontur. Die Wirkung ist abhängig von der Kontur-Farbwert | Spiel es " |
| inset | Gibt einen 3D-Einschub Umriss. Die Wirkung ist abhängig von der Kontur-Farbwert | Spiel es " |
| outset | Gibt einen 3D Anfang Umriss. Die Wirkung ist abhängig von der Kontur-Farbwert | Spiel es " |
| initial | Setzt diese Eigenschaft auf den Standardwert. Lesen Sie mehr über Anfangs | Spiel es " |
| inherit | Erbt diese Eigenschaft von seinem übergeordneten Element. Lesen Sie mehr über erben |
Mehr Beispiele
Beispiel
Stellen Sie den Stil eines Umrisses mit unterschiedlichen Werten:
p.dotted {outline-style: dotted;}
p.dashed {outline-style: dashed;}
p.solid {outline-style: solid;}
p.double {outline-style: double;}
p.groove {outline-style: groove;}
p.ridge {outline-style: ridge;}
p.inset {outline-style: inset;}
p.outset {outline-style: outset;} Versuch es selber " Verwandte Seiten
CSS Tutorial: CSS Überblick
CSS - Referenz: outline property
HTML - DOM - Referenz: outlineStyle property