CSS-Eigenschaft padding-bottom

Die CSS-Eigenschaft padding-bottom eines Elements stellt den Padding-Bereich auf der Unterseite eines Elements ein.

Negative Werte sind ungültig.
Diese Eigenschaft hat keinen Einfluss auf Inline-Elemente, wie z. B. <span>.
Anfangswert 0
Gilt für Alle Elemente, außer wenn die Eigenschaft display auf table-row-group, table-header-group, table-footer-group, table-row, table-column-group und table-column gesetzt ist. Es gilt auch für ::first-letter.
Geerbt Nein
Animierbar Ja. Der Polsterbereich ist animierbar.
Version CSS1
DOM Syntax object.style.paddingBottom = "5%";

Syntax

padding-bottom: length | initial | inherit;

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      p {
      border: 2px solid #000; 
      color: #1c87c9;
      padding-bottom: 40px;
      }
    </style>
  </head>
  <body>
    <h2>Ein Beispiel für padding-bottom</h2>
    <p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie.</p>
  </body>
</html>

Ein weiteres Beispiel, wo der Polsterbereich auf "2cm" eingestellt ist.

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      p {
      border: 2px solid #000; 
      color: #1c87c9;
      padding-bottom: 2cm;
      }
    </style>
  </head>
  <body>
    <h2>Ein Beispiel für padding-bottom</h2>
    <p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie.</p>
  </body>
</html>

Werte

Wert Beschreibung
length Es stellt die untere Polsterung in px, pt, cm usw. ein. Der Standardwert ist 0px.
% Es setzt die untere Polsterung in Prozent der Breite des enthaltenden Elements.
initial Es setzt die Eigenschaft auf den Standardwert.
inherit Es erbt die Eigenschaft von ihrem übergeordneten Element.

Browser-Support

chrome firefox safari opera
1.0+ 1.0+ 1.0+ 3.5+

Übe dein Wissen

Was ist die Funktion der CSS-Eigenschaft 'padding-bottom'?
Finden Sie das nützlich?