CSS padding-block-end Eigenschaft

Definition und Verwendung

Element padding-block-end bezeichnet den Raum zwischen dem Rand des Elements und dem Inhalt am Ende der Blockrichtung.

CSS padding-block und padding-inline Eigenschaften entsprechen den CSS-Eigenschaften padding-top,padding-bottom,padding-left und padding-right sehr ähnlich, aber padding-block und padding-inline Die Eigenschaft hängt von der Blockrichtung und der Inline-Richtung ab.

Hinweis:zugehörige CSS-Eigenschaften writing-mode Definiert die Blockrichtung. Dies beeinflusst den Anfang und das Ende der Blöcke sowie padding-block Das Ergebnis der Eigenschaft. Für englische Seiten ist die Blockrichtung nach unten, die Inline-Richtung von links nach rechts.

Beispiel

Beispiel 1

Setzen Sie den Innenabstand am Ende der Blockrichtung:

p {
  padding-block-end: 35px;
}

Probieren Sie es selbst aus

Beispiel 2

Setzen Sie den <div>-Element writing-mode Wenn die Eigenschaftswerte auf vertical-rl gesetzt werden, ist die Blockrichtung von rechts nach links. Das Ergebnis ist, dass der Endpunkt des Elements von unten nach links bewegt wird:

div {
  writing-mode: vertical-rl;
  padding-block-end: 50px;
}

Probieren Sie es selbst aus

CSS-Syntax

padding-block-end: auto|value|initial|inherit;

Eigenschaftswert

Wert Beschreibung
auto Standard. Der Standardwert von padding-block-end für das Element.
length

Padding-block-end wird in Einheiten wie px, pt, cm angegeben. Negative Werte sind nicht erlaubt.

Siehe:CSS-Einheiten.
% Padding-block-end wird als Prozentsatz der Größe des Elements in der Zeilenrichtung angegeben.
initial Diese Eigenschaft wird auf ihren Standardwert gesetzt. Siehe: initial.
inherit Diese Eigenschaft wird von ihrem übergeordneten Element geerbt. Siehe: inherit.

Technische Details

Standardwert: auto
Vererbbarkeit: Nein
Animationserstellung: Unterstützt. Siehe:Animationseigenschaften.
Version: CSS3
JavaScript-Syntax: object.style.paddingBlockEnd="100px"

Browser-Unterstützung

Die Zahlen in der Tabelle stellen die Versionsnummer des ersten Browsers dar, der diese Eigenschaft vollständig unterstützt.

Chrome Edge Firefox Safari Oper
87.0 87.0 41.0 12.1 73.0

Verwandte Seiten

Referenz:CSS padding-block Eigenschaft

Referenz:CSS padding-block-start Eigenschaft

Referenz:CSS padding-inline Eigenschaft

Referenz:CSS padding-bottom Eigenschaft

Referenz:CSS padding-left Eigenschaft

Referenz:CSS padding-right Eigenschaft

Referenz:CSS padding-top Eigenschaft

Referenz:CSS writing-mode Eigenschaft