CSS-Eigenschaft margin-top

Die CSS-Eigenschaft margin-top definiert die obere Margin des Elements

Negative Werte sind erlaubt.
Diese Eigenschaft hat keinen Einfluss auf Inline-Elemente, wie z. B. <span>.
Anfangswert 0
Gilt für Alle Elemente. Es gilt auch für ::first-letter.
Geerbt Nein
Animierbar Ja, die obere Margin des Elements ist animierbar.
Version CSS2
DOM Syntax object.style.marginTop = "50px";

Syntax

margin-top: length | auto | initial | inherit;

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      .margin-top { 
      margin-top: 100px;
      }
    </style>
  </head>
  <body>
    <h2>Beispiel für die Eigenschaft margin-top</h2>
    <p>Keine festgelegte Margin.</p>
    <p class="margin-top">100px Margin ist oben für diesen Text angegeben.</p>
  </body>
</html>

Im folgenden Beispiel wird die margin-top durch "em" angegeben:

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      p.example {
      margin-top: 5em;
      }
    </style>
  </head>
  <body>
    <h2>Margin-top property example</h2>
    <p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie.</p>
    <p class="example">Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie.</p>
    <p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie.</p>
  </body>
</html>

Werte

Wert Beschreibung
auto Stellt die obere Margin ein. Es ist der Standardwert dieser Eigenschaft.
length Definiert die obere Margin in px, pt, cm, usw. Der Standardwert ist 0.
% Stellt die obere Margin in % des enthaltenden Elements ein.
initial Der Wert stellt die Eigenschaft auf seinen Standardwert ein.
inherit Der Wert erbt die Eigenschaft von seinem übergeordneten Element.

Browser-Support

1.0+ 1.0+ 1.0+ 3.5+


Finden Sie das nützlich?

Ähnliche Artikel