HTML <menu> Tag defines an Unordered List of items. For creating an unordered list, we can use the <menu> tag with HTML <li> tags. The HTML <menu> tag is a semantic tag and an alternative option for the HTML <ul> tag.
Syntax
<menu>
<li>Content... </li>
<li>Content... </li>
</menu>
Supported Attribute
The HTML <menu> tag supports the Global Attributes and Event Attributes.
Note: The HTML <menu> Tag was removed in HTML 4.01 but in HTML5 it has been redefined. Previously, list items were declared within the deprecated <menuitem> element. Now, the <li> element serves as a suitable alternative.
Example 1: Implementation of the <menu> tag with the Browser’s Default CSS.
<!DOCTYPE html>
<html>
<head>
<title>HTML menu Tag</title>
<style>
menu {
display: block;
list-style-type: disc;
margin-block-start: 1em;
margin-block-end: 1em;
margin-inline-start: 0px;
margin-inline-end: 0px;
padding-inline-start: 40px;
}
</style>
</head>
<body>
<p>HTML <menu> tag</p>
<menu>
<li>menu list</li>
<li>unordered list</li>
<li>ordered list</li>
</menu>
</body>
</html>
Output:
Example 2: Implementation of menu tag by using Custom CSS.
<!DOCTYPE html>
<html>
<head>
<title>HTML menu Tag</title>
<style>
menu {
color: rgb(45, 139, 45);
font-weight: 700;
}
</style>
</head>
<body>
<p>HTML menu tag</p>
<menu>
<li>menu list</li>
<li>unordered list</li>
<li>ordered list</li>
</menu>
</body>
</html>
Output:
HTML DOM Property
HTML DOM Menu Object can be used with the <menu> Tag.
Browser Support
- Chrome 1
- Edge 12
- Firefox 1
- Opera 12.1
- Safari 3