style borderStyle- Eigenschaft

Fügen Sie einem <div>-Element einen "durchgezogenen" Rahmen hinzu:

document.getElementById("myDiv").style.borderStyle = "solid";

Definition und Verwendung

Die Eigenschaft borderStyle legt den Stil des Rahmens eines Elements fest oder gibt ihn zurück.

Diese Eigenschaft kann einen bis vier Werte annehmen:

Ein Wert, wie: p {border-style: solid} – alle vier Ränder werden solide sein
Zwei Werte, wie: p {border-style: solid dotted} - oberer und unterer Rand werden durchgezogen, linker und rechter Rand werden gepunktet
Drei Werte, wie: p {border-style: solid dotted double} – der obere Rand ist durchgehend, der linke und der rechte Rand sind gepunktet, der untere Rand ist doppelt
Vier Werte, wie: p {border-style: solid dotted double dashed} – der obere Rand ist durchgehend, der rechte Rand ist gepunktet, der untere Rand ist doppelt, der linke Rand ist gestrichelt

Property
borderStyle	Yes	Yes	Yes	Yes	Yes

Geben Sie die Eigenschaft borderStyle zurück:

object.style.borderStyle

Legen Sie die Eigenschaft borderStyle fest:

object.style.borderStyle = value

Value	Description
none	Defines no border. This is default
hidden	The same as "none", except in border conflict resolution for table elements
dotted	Defines a dotted border
dashed	Defines a dashed border
solid	Defines a solid border
double	Defines two borders. The width of the two borders are the same as the border-width value
groove	Defines a 3D grooved border. The effect depends on the border-color value
ridge	Defines a 3D ridged border. The effect depends on the border-color value
inset	Defines a 3D inset border. The effect depends on the border-color value
outset	Defines a 3D outset border. The effect depends on the border-color value
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

Standardwert:	keiner
Rückgabewert:	Ein String, der den Stil des Rahmens eines Elements darstellt
CSS-Version	CSS1

Ändern Sie den Stil der vier Rahmen eines <div>-Elements:

document.getElementById("myDiv").style.borderStyle = "dotted solid double dashed";

Gibt den Rahmenstil eines <div>-Elements zurück:

alert(document.getElementById("myDiv").style.borderStyle);

Eine Demonstration all der verschiedenen Werte:

var listValue = selectTag.options[selectTag.selectedIndex].text;
document.getElementById("myDiv").style.borderStyle = listValue;