Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
-webkit-border-before
Nicht standardisiert: Diese Funktion ist nicht standardisiert. Wir raten davon ab, nicht-standardisierte Funktionen auf produktiven Webseiten zu verwenden, da sie nur von bestimmten Browsern unterstützt werden und sich in Zukunft ändern oder entfernt werden können. Unter Umständen kann sie jedoch eine geeignete Option sein, wenn es keine standardisierte Alternative gibt.
Die-webkit-border-beforeCSS Eigenschaft ist eine Kurzschreibweise zum Festlegen der individuellen logischen Block-Start-Grenzeigenschaften an einer einzigen Stelle im Stylesheet.
Bestandteileigenschaften
Diese Eigenschaft ist eine Kurzschreibweise für die folgenden CSS-Eigenschaften:
Syntax
/* Border values */-webkit-border-before: 1px;-webkit-border-before: 2px dotted;-webkit-border-before: medium dashed blue;/* Global values */-webkit-border-before: inherit;-webkit-border-before: initial;-webkit-border-before: revert;-webkit-border-before: revert-layer;-webkit-border-before: unset;Werte
Eines oder mehrere der folgenden, in beliebiger Reihenfolge:
Beschreibung
Die-webkit-border-before Eigenschaft wird je nach Schreibmodus, Richtung und Textorientierung des Elements einer physischen Grenze zugeordnet. Sie entspricht derborder-top,border-right,border-bottom, oderborder-left Eigenschaft, abhängig von den fürwriting-mode,direction, undtext-orientation definierten Werten.
Sie steht in Zusammenhang mit-webkit-border-after,-webkit-border-start, und-webkit-border-end, welche die anderen Grenzen des Elements definieren.
Das standard-konforme Äquivalent dieser Eigenschaft istborder-block-start.
Formale Definition
| Anfangswert | wie die jeweiligen Kurzschreibweisen:
|
|---|---|
| Anwendbar auf | alle Elemente |
| Vererbt | Ja |
| Prozentwerte | wie die jeweiligen Kurzschreibweisen:
|
| Berechneter Wert | wie die jeweiligen Kurzschreibweisen:
|
| Animationstyp | diskret |
Formale Syntax
-webkit-border-before =
<'border-width'>||
<'border-style'>||
<color>
<border-width> =
<'border-top-width'>{1,4}
<border-style> =
<'border-top-style'>{1,4}
<border-top-width> =
<line-width>
<border-top-style> =
<line-style>
<line-width> =
<length [0,∞]>|
thin|
medium|
thick
<line-style> =
none|
hidden|
dotted|
dashed|
solid|
double|
groove|
ridge|
inset|
outset
Beispiele
Anwenden einer Grenze bei vertikalem Text
HTML
<div> <p>Example text</p></div>CSS
div { background-color: yellow; width: 120px; height: 120px;}.exampleText { writing-mode: vertical-rl; -webkit-border-before: 5px dashed blue;}Ergebnis
Spezifikationen
Kein Teil eines Standards, aber es steht im Zusammenhang mit der standard-konformenborder-block-start Eigenschaft.
Browser-Kompatibilität
Siehe auch
border-block-start- Die zugeordneten physischen Eigenschaften:
border-top,border-right,border-bottom, undborder-left writing-mode,direction,text-orientation