HTML <menu> Tag
Example
A context menu with different <menuitem> elements:
<menu type="context" id="mymenu">
<menuitem label="Refresh" onclick="window.location.reload();" icon="ico_reload.png">
</menuitem>
<menu label="Share on...">
<menuitem label="Twitter" icon="ico_twitter.png"
onclick="window.open('//twitter.com/intent/tweet?text='+window.location.href);">
</menuitem>
<menuitem label="Facebook" icon="ico_facebook.png"
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>
Try it Yourself »
Definition and Usage
The <menu> tag defines a list/menu of commands.
The <menu> tag is used for context menus, toolbars and for listing form controls and commands.
Browser Support
The numbers in the table specify the first browser version that fully supports the element.
| Element | |||||
|---|---|---|---|---|---|
| <menu> | Not supported | Not supported | 8.0 (only context menus) |
Not supported | Not supported |
Note: The <menu> tag is only supported in Firefox, and it only works for context menus.
Tips and Notes
Tip: Use CSS to style menu lists.
Attributes
| Attribute | Value | Description |
|---|---|---|
| label | text | Specifies a visible label for the menu |
| type | list toolbar context |
Specifies which type of menu to display |
Global Attributes
The <menu> tag also supports the Global Attributes in HTML.
Event Attributes
The <menu> tag also supports the Event Attributes in HTML.
Related Pages
HTML DOM reference: Menu Object
Default CSS Settings
Most browsers will display the <menu> element with the following default values:
menu {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}
