English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Rand-Die style CSS-Eigenschaft ist die Festlegung eines einzelnen Kantenstil-Attributs, d.h.Rand-oben-style，Rand-rechts-style，Rand-unten-styleundRand-links-styleKurzschreibweise.
Die Tabelle unten zeigt die Verwendung und Versionsgeschichte dieses Attributes sowie die Syntax in JavaScript-Skripten.
| Standardwert: | none |
|---|---|
| Geeignet für: | Alle Elemente |
| Vererben: | Keine |
| Animierbar: | Nein.Siehe auch Animationseigenschaften。 |
| Version: | CSS 1，2，3 |
| JavaScript-Syntax: | object object.style.borderStyle="dotted double" |
Die Syntax dieses Attributes ist wie folgt:
Rand-style: [ none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset ] 1 zu 4 values | initial | inherit
Diese Kurznamen können ein, zwei, drei oder vier durch Leerzeichen getrennte Werte haben.
wenn spezifiziertein Wertwird es auf alle vier Kanten angewendet.
wenn spezifiziertzwei Wertewird der erste Wert auf die oberen und unteren Kanten angewendet, während der zweite Wert auf die rechten und linken Kanten angewendet wird.
wenn spezifiziertdrei Wertewird der erste Wert auf die obere Kante angewendet, der zweite Wert auf die rechten und linken Kanten und der dritte Wert auf die untere Kante angewendet.
wenn spezifiziertvier Wertewenn keine spezifiziert wird, wird jeder Wert in der Reihenfolge Oben, Rechts, Unten und Links auf die Kante angewendet.
Der folgende Beispiel zeigt, wie man border verwendet-style-Eigenschaft.
p {
Rand-style: double;
Rand-Breite: 5px;
}Testen Sie, um zu sehen‹/›Die nachstehende Tabelle beschreibt die Werte dieses Attributes.
| Wert | Beschreibung |
|---|---|
| none | keinen Rand anzeigen. |
| hidden | und gleiche none, der Unterschied darin besteht, dass die Tabellenzellengeklappte Ränderund zwei Zellen teilen die Grenze. Der hidden-Wert stellt sicher, dass der Rand nicht gezeichnet wird, da er hidden vor allen anderen Randstile priorisiert ist. |
| dotted | Zeigt den Rand als eine Reihe von Punkten an. |
| dashed | Zeigt den Rand als eine Reihe von kurzen Linien an, d.h. Strichen. |
| solid | Zeigt den Rand als eine durchgehende Linie an. |
| double | Zeigt den Rand als zwei parallele Linien an und lässt zwischen ihnen einen bestimmten Abstand. Die Summe der beiden Reihen sowie der Abstand zwischen ihnen beträgtRand-BreiteWert. |
| groove | Zeigt einen in die Leinwand gezeichneten Rand an. Es gibt den Eindruck3D des Eindrucks, in der Regel durch die Verwendung einer Farbe erreicht, die heller ist als die RandfarbeRand-Farbedunkler und hellerer Farben durch die Erstellung eines Schattens erreicht. |
| ridge | Zeigt einen Rand im Gegensatz zum Effekt an. Es gibt auch den Eindruck3D des Eindrucks, der Rand scheint so aus der Leinwand herauszukommen. |
| inset | Zeigt einen Rand an, der so aussieht, als ob er in die Leinwand eingebettet wäre. Es gibt den Eindruck3D, dies wird in der Regel durch die Erstellung eines Schattens in zwei Farben erreicht, die heller sind als die RandfarbeRand-Farbeetwas heller und dunkler. |
| outset | Zeigt einen Rand im Gegensatz zum Effekt an. Es gibt auch den Eindruck3D des Eindrucks, der Rand macht den Käfig so aus, als ob er aus dem Bildschirm herauskommt. |
| inherit | Wenn angegeben, wird der Rand des übergeordneten Elements verwendet-oben-Wert des style-Attributs. |
Rand-Kompatibilität des style-Attributs des Browsers, die in der nachstehenden Tabelle enthaltenen Zahlen stellen die niedrigste Versionsnummer dar, die den Attribut unterstützt; alle gängigen Browser unterstützen diesen Attribut.
Browser-Unterstützung–
|
Warnung： Internet Explorer 7und frühere Versionen unterstützen den hidden-Wert nicht. IE8unterstützt, aber erfordert einen<!DOCTYPE>。IE9und höher unterstützen den hidden-Wert.
Siehe Anleitung：CSS Rand，CSS3 Rand。
zusammenhängende Eigenschaften：Rand，Rand-Breite，Rand-Farbe，Rand-oben-style，Rand-rechts-style，Rand-unten-style，Rand-links-style。