HTML <menu> 标签用于创建菜单内容列表。我们可以使用 <li> 标签在菜单项内部创建列表项。
HTML <menu> 标签在 HTML4 中已弃用，并在 HTML5 中重新引入。但最好忽略此标签，因为它是实验性的，不受许多浏览器的支持。
语法
<menu>
... ...
<menu>
属性
HTML <menu> 标签支持 HTML 的 全局属性 和 事件属性。还接受下面列出的一些特定属性。
| 属性 | 值 | 描述 |
|---|---|---|
| label | text | 指定可见标签。（只适用html5） |
| type |
popup toolbar context |
指定要显示的菜单类型。（只适用html5） |
HTML <menu> 标签示例
下面的示例将说明<menu> 标签的用法。在哪里、何时以及如何使用<menu> 标签创建菜单列表。
使用<menu> 标签创建菜单项
让我们看一下以下示例，我们将在其中使用菜单标签。
<!DOCTYPE html>
<html>
<head>
<title>HTML menu Tag</title>
</head>
<body>
<menu>
<li>ol - Ordered list</li>
<li>ul - Unordered list</li>
<li>dir - Directory list</li>
<li>menu - Menu list</li>
</menu>
</body>
</html>
使用 CSS 设置菜单项的样式
在此示例中，我们将使用内部 CSS 设置菜单元素的样式。
<!DOCTYPE html>
<html>
<head>
<title>HTML menu Tag</title>
<style>
menu {
display: flex;
list-style: none;
padding: 10px;
width: 600px;
}
li {
flex-grow: 1;
}
button {
width: 100%;
padding: 10px;
background-color: lightgray;
font-weight: 600;
}
</style>
</head>
<body>
<menu>
<li><button onclick="html()">HTML</button></li>
<li><button onclick="css()">CSS</button></li>
<li><button onclick="js()">JS</button></li>
</menu>
</body>
</html>
支持的浏览器
| 浏览器 |  |
 |
 |
 |
 |
|---|---|---|---|---|---|
| 是否支持 | Yes | Yes | Yes | Yes | Yes |
