This wiki has been archived and is now read-only.


From HTML Wiki
Jump to: navigation, search


The <menu> element represents a list of commands.

HTML Attributes

  • type = context/ toolbar/ list
    Indicates the kind of menu being declared:
    • context
      the commands of a context menu, and the user can only interact with the commands if that context menu is activated. [Example B]
    • toolbar
      A list of active commands that the user can immediately interact with. [Example A]
    • list
      an unordered list of items (each represented by an li element), each of which represents a command that the user can perform or activate, or, if the element has no li element children, flow content describing available commands.
  • label = string
    Gives the label of the menu.

See also global attributes.


Example A

For example, the following represents a toolbar with three menu buttons on it, each of which has a dropdown menu with a series of options [try it]:

<menu type="toolbar">
    <menu label="File">
      <button type="button" onclick="fnew()">New...</button>
      <button type="button" onclick="fopen()">Open...</button>
      <button type="button" onclick="fsave()">Save</button>
      <button type="button" onclick="fsaveas()">Save as...</button>
    <menu label="Edit">
      <button type="button" onclick="ecopy()">Copy</button>
      <button type="button" onclick="ecut()">Cut</button>
      <button type="button" onclick="epaste()">Paste</button>
    <menu label="Help">
      <li><a href="help.html">Help</a></li>
      <li><a href="about.html">About</a></li>

Example B

Here is an example of a context menu for an input control [try it]:

<form name="npc">
  <label>Character name: <input name=char type=text contextmenu=namemenu required></label>
   <menu type=context id=namemenu>
     <command label="Pick random name"
        onclick="document.forms.npc.elements.char.value = getRandomName()">
     <command label="Prefill other fields based on name"

HTML Reference

The HTML5 specification defines the <menu> element in 4.12.4 The menu element.