CSS
Umrisse
Suche…
Syntax
- Umriss: Umrissfarbe Umrissbreite | initial | erben;
- Umrissbreite: mittel | dünn | dick | Länge | initial | erben;
- Gliederungsstil: keine | versteckt | gepunktet | gestrichelt | fest | doppelt | Nut | Grat | Einschub | Anfang | initial | erben;
Parameter
| Parameter | Einzelheiten |
|---|---|
| gepunktet | gepunktete Kontur |
| gestrichelt | gestrichelte Kontur |
| solide | feste Kontur |
| doppelt | doppelter Umriss |
| Rille | 3D-gerillte Umrisse hängen vom Umrissfarbenwert ab |
| Grat | Gerippte 3D-Konturen hängen vom Konturfarbenwert ab |
| Einsatz | Die 3D-Umrisslinie hängt vom Umrissfarbenwert ab |
| Anfang | Die 3D-Anfangsumrisslinie hängt vom Umrissfarbenwert ab |
| keiner | keine Gliederung |
| versteckt | versteckter Umriss |
Bemerkungen
outline wird nun in Basic UI , einem CSS-Modul Level 3 (es wurde bereits in REC CSS2.1 beschrieben) beschrieben.
Die Gliederungseigenschaft ist in Browsern standardmäßig für fokussierbare Elemente in :focus Fokusstatus definiert.
Es sollte nicht entfernt werden, siehe http://outlinenone.com. Dort heißt es:
Was macht die Gliederungseigenschaft?
Es bietet visuelles Feedback für Links, die beim Navigieren in einem Webdokument mit der TAB-Taste (oder einer gleichwertigen Funktion) "Fokus" haben. Dies ist besonders nützlich für Leute, die keine Maus verwenden oder eine Sehbehinderung haben. Wenn Sie die Gliederung entfernen, machen Sie Ihre Site für diese Personen unzugänglich. (…)
Interessante verwandte Beispiele zum Stack Overflow:
Überblick
Gliederung ist eine Linie, die um das Element außerhalb der Grenze verläuft. Im Gegensatz zu border , umreißt jeden Raum in dem Box - Modell nicht nehmen Sie. Das Hinzufügen einer Gliederung zu einem Element hat also keinen Einfluss auf die Position des Elements oder anderer Elemente.
Außerdem können Konturen in einigen Browsern nicht rechteckig sein. Dies kann passieren, wenn die outline auf ein span Element angewendet wird, in dem sich Text mit anderen Eigenschaften für die font-size . Im Gegensatz zu Rändern dürfen Konturen keine abgerundeten Ecken haben.
Die wesentlichen Bestandteile von outline sind outline-color , outline-style und outline-width .
Die Definition einer Gliederung entspricht der Definition einer Grenze:
Eine Kontur ist eine Linie um ein Element. Es wird um den Rand des Elements angezeigt. Es unterscheidet sich jedoch von der Grenzeigenschaft.
outline: 1px solid black;
Umriss-Stil
Mit outline-style Eigenschaft "Konturstil" wird der Stil der Kontur eines Elements festgelegt.
p {
border: 1px solid black;
outline-color:blue;
line-height:30px;
}
.p1{
outline-style: dotted;
}
.p2{
outline-style: dashed;
}
.p3{
outline-style: solid;
}
.p4{
outline-style: double;
}
.p5{
outline-style: groove;
}
.p6{
outline-style: ridge;
}
.p7{
outline-style: inset;
}
.p8{
outline-style: outset;
}
HTML
<p class="p1">A dotted outline</p>
<p class="p2">A dashed outline</p>
<p class="p3">A solid outline</p>
<p class="p4">A double outline</p>
<p class="p5">A groove outline</p>
<p class="p6">A ridge outline</p>
<p class="p7">An inset outline</p>
<p class="p8">An outset outline</p>
