Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.mozilla.org/de/docs/Web/HTML/Reference/Elements/div below:

<div>: Das Content-Division-Element - HTML

Baseline Widely available

Das <div> HTML Element ist der generische Container für Flussinhalt. Es hat keine Auswirkung auf den Inhalt oder das Layout, bis es in irgendeiner Weise mithilfe von CSS gestaltet wird (z.B. wenn direktes Styling darauf angewendet wird oder ein Layout-Modell wie Flexbox auf das Elternelement angewendet wird).

<div class="warning">
  <img
    src="/shared-assets/images/examples/leopard.jpg"
    alt="An intimidating leopard." />
  <p>Beware of the leopard</p>
</div>

.warning {
  border: 10px ridge red;
  background-color: yellow;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
}

.warning img {
  width: 100%;
}

.warning p {
  font: small-caps bold 1.2rem sans-serif;
  text-align: center;
}

Als "reiner" Container repräsentiert das <div> Element nichts Eigenes. Stattdessen wird es verwendet, um Inhalte zu gruppieren, sodass sie leicht unter Verwendung der class oder id Attribute gestylt werden können, um einen Abschnitt eines Dokuments als in einer anderen Sprache geschrieben zu markieren (mittels des lang Attributs), und so weiter.

Dieses Element schließt die globalen Attribute ein.

Hinweis: Das align Attribut ist veraltet; verwenden Sie es nicht mehr. Stattdessen sollten Sie CSS-Eigenschaften oder -Techniken wie CSS Grid oder CSS Flexbox verwenden, um <div> Elemente auf der Seite auszurichten und zu positionieren.

• Das <div> Element sollte nur verwendet werden, wenn kein anderes semantisches Element (wie <article> oder <nav>) geeignet ist.

Das <div> Element hat eine implizite Rolle von generic, und nicht keine. Dies kann bestimmte ARIA-Kombinationserklärungen beeinflussen, die erwarten, dass ein direkter Nachfahre mit einer bestimmten Rolle korrekt funktioniert.

<div>
  <p>
    Any kind of content here. Such as &lt;p&gt;, &lt;table&gt;. You name it!
  </p>
</div>

Dieses Beispiel erstellt eine beschattete Box, indem ein Stil mithilfe von CSS auf das <div> angewendet wird. Beachten Sie die Verwendung des class Attributs auf dem <div>, um den Stil namens "shadowbox" auf das Element anzuwenden.

<div class="shadowbox">
  <p>Here's a very interesting note displayed in a lovely shadowed box.</p>
</div>

.shadowbox {
  width: 15em;
  border: 1px solid #333333;
  box-shadow: 8px 8px 5px #444444;
  padding: 8px 12px;
  background-image: linear-gradient(180deg, white, #dddddd 40%, #cccccc);
}

• Semantische Abschnittselemente: <section>, <article>, <nav>, <header>, <footer>
• <span> Element für das Styling von Formatinhalten

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4