<menu>: El elemento menú

El elemento HTML <menu> se describe en la especificación HTML como una alternativa semántica a <ul>, pero los navegadores lo tratan (y lo exponen a través del árbol de accesibilidad) como no diferente de <ul>. Representa una lista desordenada de elementos (que están representados por elementos <li>).

Pruébalo

Atributos

Este elemento solo incluye los atributos globales.

Notas de uso

Los elementos <menu> y <ul> representan una lista desordenada de elementos. La diferencia clave es que <ul> contiene principalmente elementos para mostrar, mientras que <menu> estaba destinado a elementos interactivos. El elemento <menuitem> relacionado ha quedado obsoleto.

Nota: En las primeras versiones de la especificación HTML, el elemento <menu> tenía un caso de uso adicional como menú contextual. Esta funcionalidad se considera obsoleta y no está en la especificación.

Ejemplo

Barra de herramientas

En este ejemplo, se usa un <menú> para crear una barra de herramientas para una aplicación de edición.

HTML

html
<menu>
  <li><button onclick="copy()">Copiar</button></li>
  <li><button onclick="cut()">Cortar</button></li>
  <li><button onclick="paste()">Pegar</button></li>
</menu>

Tenga en cuenta que esto no es funcionalmente diferente de:

html
<ul>
  <li><button onclick="copy()">Copiar</button></li>
  <li><button onclick="cut()">Cortar</button></li>
  <li><button onclick="paste()">Pegar</button></li>
</ul>

CSS

css
menu,
ul {
  display: flex;
  list-style: none;
  padding: 0;
  width: 400px;
}

li {
  flex-grow: 1;
}

button {
  width: 100%;
}

Resultado

Resumen técnico

Categorías de contenido

Contenido de flujo. Si los hijos del elemento incluyen al menos un elemento <li>: contenido palpable.

Contenido permitido

Cero o más ocurrencias de <li>, <script>, ó <template>.

Omisión de etiqueta None, both the starting and ending tag are mandatory.
Padres permitidos Cualquier elemento que acepte contenido de flujo.
Rol ARIA implícito lista
Roles ARIA permitidos directory, group, listbox, menu, menubar, none, presentation, radiogroup, tablist, toolbar ó tree
Interfaz DOM HTMLMenuElement

Especificaciones

Specification
HTML Standard
# the-menu-element

Compatibilidad con navegadores

BCD tables only load in the browser

Véase también

  • Otros elementos HTML relacionados con listas: <ol>, <ul>, y <li>.