style borderColor- Eigenschaft
Beispiel
Ändern Sie die Farbe der vier Ränder eines <div>-Elements in Rot:
document.getElementById("myDiv").style.borderColor = "red";
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Die Eigenschaft borderColor legt die Farbe des Rahmens eines Elements fest oder gibt sie zurück.
Diese Eigenschaft kann einen bis vier Werte annehmen:
- Ein Wert, wie: p {border-color: red} – alle vier Ränder sind rot
- Zwei Werte, wie: p {border-color: red transparent} - oberer und unterer Rand sind rot, linker und rechter Rand sind transparent
- Drei Werte, wie: p {border-color: red green blue} – der obere Rand ist rot, der linke und der rechte Rand sind grün, der untere Rand ist blau
- Vier Werte, wie: p {border-color: red green blue yellow} – der obere Rand ist rot, der rechte Rand ist grün, der untere Rand ist blau, der linke Rand ist gelb
Browser-Unterstützung
Die Zahlen in der Tabelle geben die erste Browserversion an, die die Eigenschaft vollständig unterstützt.
Property | |||||
---|---|---|---|---|---|
borderColor | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Syntax
Geben Sie die Eigenschaft borderColor zurück:
object.style.borderColor
Legen Sie die Eigenschaft borderColor fest:
object.style.borderColor = "color|transparent|initial|inherit"
Eigenschaftswerte
Value | Description |
---|---|
color | Specifies the color of the border. Look at CSS Color Values for a complete list of possible color values. Default color is the current color of the element |
transparent | The color of the border is transparent (underlying content will shine through) |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Technische Details
Standardwert: | aktuelle Farbe |
---|---|
Rückgabewert: | Ein String, der die Farbe des Rahmens eines Elements darstellt |
CSS-Version | CSS1 |
Mehr Beispiele
Beispiel
Ändern Sie die Farbe des oberen und unteren Rands eines <div>-Elements in grün und des linken und rechten Rands in lila:
document.getElementById("myDiv").style.borderColor = "green purple";
Beispiel
Gibt die Rahmenfarbe eines <div>-Elements zurück:
alert(document.getElementById("myDiv").style.borderColor);
Verwandte Seiten
CSS-Tutorial: CSS-Border
CSS-Referenz: Eigenschaft border-color
HTML-DOM-Referenz: Border-Eigenschaft