HTML-Tag <menu>

❮ Vorige Nächste ❯

Das Tag <menu> definiert eine Liste oder ein Menü von Befehlen dar. Es wird für die Erstellung von Kontextmenüs, Symbolleisten und die Auflistung von Formularsteuerelementen und Befehlen verwendet.

Jeder Listeneintrag im Tag <menu> beginnt mit dem Element <li> oder mit dem Element <menuitem>.

Das Tag <menu> wird in HTML 4.0 nicht mehr verwendet. Es funktioniert nur für die Kontextmenüs. Es wurde durch das Element <ul> ersetzt.

Syntax

Das Tag <menu> wird gepaart verwendet. Sein Inhalt muss in den Start- (<menu>) und Endtags (</menu>) eingeschlossen werden.

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      menuitem {
        display: block;
      }
    </style>
  </head>
  <body>
    <menu>
<menuitem>ol - geordnete Liste</menuitem>
      <menuitem>ul - ungeordnete Liste</menuitem>
      <menuitem>menu - Menüliste</menuitem>
    </menu>
  </body>
</html>

Versuch es selber!

Ergebnis

Dasselbe können wir mit dem Element <menu> machen:

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
  </head>
  <body>
    <div style="background:#1c87c9; padding: 20px; text-align:center; color:#ffffff;" contextmenu="menuexample">
      <p>Machen Sie einen Rechtsklick auf dieses Feld, um das Kontextmenü zu öffnen.</p>
      <menu type="context" id="menuexample">
        <menuitem label="Refresh" onclick="window.location.reload();"></menuitem>
        <menu label="Share on...">
          <menuitem label="Twitter" onclick="window.open('//twitter.com/intent/tweet?text=' + window.location.href);"></menuitem>
          <menuitem label="Facebook" onclick="window.open('//facebook.com/sharer/sharer.php?u=' + window.location.href);"></menuitem>
        </menu>
        <menuitem label="Email This Page" onclick="window.location='mailto:?body='+window.location.href;"></menuitem>
      </menu>
    </div>
    <p><span style="color:red;">Achtung:</span> Diese Funktion wird nur in Firefox unterstützt.</p>
  </body>
</html>