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

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

<menu>: Das Menu-Element - HTML

Baseline Widely available

Das <menu> HTML-Element wird in der HTML-Spezifikation als semantische Alternative zu <ul> beschrieben, jedoch von Browsern (und im Zugänglichkeitsbaum) nicht anders als <ul> behandelt. Es repräsentiert eine ungeordnete Liste von Elementen (die durch <li>-Elemente dargestellt werden).

<div class="news">
  <a href="#">NASA’s Webb Delivers Deepest Infrared Image of Universe Yet</a>
  <menu>
    <li><button id="save">Save for later</button></li>
    <li><button id="share">Share this news</button></li>
  </menu>
</div>

.news {
  background-color: bisque;
  padding: 1em;
  border: solid thin black;
}

menu {
  list-style-type: none;
  display: flex;
  padding: 0;
  margin-bottom: 0;
  gap: 1em;
}

Dieses Element akzeptiert auch die globalen Attribute.

compact Veraltet

Dieses boolesche Attribut deutet darauf hin, dass die Liste in einem kompakten Stil gerendert werden sollte. Die Interpretation dieses Attributs ist browserspezifisch. Verwenden Sie stattdessen CSS: Um einen ähnlichen Effekt wie das compact-Attribut zu erzielen, kann die CSS-Eigenschaft line-height mit einem Wert von 80% verwendet werden.

Die <menu>- und <ul>-Elemente repräsentieren beide eine ungeordnete Liste von Elementen. Der wesentliche Unterschied besteht darin, dass <ul> hauptsächlich Elemente zur Anzeige enthält, während <menu> eine Werkzeugleiste mit Befehlen darstellt, die der Benutzer ausführen oder aktivieren kann.

Hinweis: In frühen Versionen der HTML-Spezifikation hatte das <menu>-Element einen zusätzlichen Anwendungsfall als Kontextmenü. Diese Funktionalität wird als obsolet betrachtet und befindet sich nicht mehr in der Spezifikation.

In diesem Beispiel wird ein <menu> verwendet, um eine Werkzeugleiste für eine Bearbeitungsanwendung zu erstellen.

<menu>
  <li><button onclick="copy()">Copy</button></li>
  <li><button onclick="cut()">Cut</button></li>
  <li><button onclick="paste()">Paste</button></li>
</menu>

Beachten Sie, dass dies funktional nicht anders ist als:

<ul>
  <li><button onclick="copy()">Copy</button></li>
  <li><button onclick="cut()">Cut</button></li>
  <li><button onclick="paste()">Paste</button></li>
</ul>

menu,
ul {
  display: flex;
  list-style: none;
  padding: 0;
  width: 400px;
}

li {
  flex-grow: 1;
}

button {
  width: 100%;
}

Flussinhalt. Wenn die Kinder des Elements mindestens ein <li>-Element enthalten: greifbarer Inhalt.

Null oder mehr Vorkommen von <li>, <script> und <template>.

• Andere HTML-Elemente im Zusammenhang mit Listen: <ol>, <ul>, und <li>.

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