Stil borderBottomEigenschaft
Style-Objekt
Definition und Verwendung
Die Eigenschaft borderBottom legt die drei einzelnen border-bottom-Eigenschaften in Kurzschreibweise fest oder gibt sie zurück.
Mit dieser Eigenschaft können Sie festlegen/zurückgeben:
- border-bottom-width
- border-bottom-style
- border-bottom-color
Syntax
Festlegen der Eigenschaft borderBottom:
Object.style.borderBottom="width style color"
Zurückgeben der Eigenschaft borderBottom:
Object.borderBottom
Tipp:Die Eigenschaft borderBottom hat keinen Standardwert.
| Parameters | Beschreibung |
|---|---|
| width | Legt die Breite des unteren Rahmens fest. |
| style | Legt den Stil des unteren Rahmens fest. |
| color | Legt den unteren Rahmen fest. |
Browser-Unterstützung
![]()
![]()
![]()
![]()
![]()
Alle wichtigen Browser unterstützen die Eigenschaft borderBottom.
Beispiel
Beispiel
Ändern Sie die Breite, den Stil und die Farbe des unteren Rahmens:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Beispiel-Tutorial(example.com)</title>
<style type="text/css">
#ex1{
border: thin dotted #FF0000;
}
</style>
<script>
function displayResult(){
document.getElementById("ex1").style.borderBottom="thick solid #0000FF";
}
</script>
</head>
<body>
<div id="ex1">Dies ist ein Text.</div>
<br>
<button type="button" onclick="displayResult()">Unteren Rahmen ändern</button>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Beispiel-Tutorial(example.com)</title>
<style type="text/css">
#ex1{
border: thin dotted #FF0000;
}
</style>
<script>
function displayResult(){
document.getElementById("ex1").style.borderBottom="thick solid #0000FF";
}
</script>
</head>
<body>
<div id="ex1">Dies ist ein Text.</div>
<br>
<button type="button" onclick="displayResult()">Unteren Rahmen ändern</button>
</body>
</html>
Selbst ausprobieren »
Style-Objekt Andere Erweiterungen