Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
border-left-width
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Dieborder-left-widthCSS Eigenschaft legt die Breite des linken Randes eines Elements fest.
Probieren Sie es aus
border-left-width: thick;border-left-width: 2em;border-left-width: 4px;border-left-width: 2ex;border-left-width: 0;<section> <div> This is a box with a border around it. </div></section>#example-element { background-color: palegreen; color: black; border: 0 solid crimson; padding: 0.75em; width: 80%; height: 100px;}Syntax
css
/* Keyword values */border-left-width: thin;border-left-width: medium;border-left-width: thick;/* <length> values */border-left-width: 10em;border-left-width: 3vmax;border-left-width: 6px;/* Global keywords */border-left-width: inherit;border-left-width: initial;border-left-width: revert;border-left-width: revert-layer;border-left-width: unset;Werte
<line-width>Definiert die Breite des Randes, entweder als explizite nicht-negative
<length>oder als Schlüsselwort. Wenn es ein Schlüsselwort ist, muss es einer der folgenden Werte sein:thin- Entspricht
1px.
- Entspricht
medium- Entspricht
3px.
- Entspricht
thick- Entspricht
5px.
- Entspricht
Formale Definition
| Anfangswert | medium |
|---|---|
| Anwendbar auf | alle Elemente. Auch anwendbar auf::first-letter. |
| Vererbt | Nein |
| Berechneter Wert | die absolute Länge;0 fallsborder-left-stylenone oderhidden ist |
| Animationstyp | Längenangabe |
Formale Syntax
border-left-width =
<line-width>
<line-width> =
<length [0,∞]>|
thin|
medium|
thick
Beispiele
Vergleich von Randbreiten
HTML
html
<div>Element 1</div><div>Element 2</div>CSS
css
div { border: 1px solid red; margin: 1em 0;}div:nth-child(1) { border-left-width: thick;}div:nth-child(2) { border-left-width: 2em;}Ergebnis
Spezifikationen
| Specification |
|---|
| CSS Backgrounds and Borders Module Level 3 # border-width |
Browser-Kompatibilität
Siehe auch
- Die anderen verwandten CSS-Eigenschaften für Randbreiten:
border-top-width,border-right-width,border-bottom-width, undborder-width. - Die anderen verwandten CSS-Eigenschaften für den linken Rand:
border,border-left,border-left-style, undborder-left-color.