> According to [documentation](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/menu), "In early versions of the HTML specification, the `menu` element had an additional use case as a context menu. This functionality is considered obsolete and is not in the specification." 

In this shot, we'll learn the purpose and usage of the **`menu`** element in HTML or HyperText Markup Language.

As the name suggests, `menu` is suitable for toolbars, commands, and context menus. These are displayed in the form of an unordered list:  `<ul>`.

> **Note**: An unordered list - `<ul>` groups a collection of items without a numerical order.

# Syntax

A `menu` element must have both opening (`<>`) and closing (`</>`) tags as `<menu>` and `</menu>`.

The `<menu>` element must include `menuitem` elements or `li` elements, similar to how `<ul>` includes `<li>` tags to display content in a menu form.


# Code

To implement a `<menu>` tag, look at the following code snippet. The `menu` elements can be styled using #key# CSS: Cascade Style Sheets #key# according to user needs as shown in the code below.

<!DOCTYPE html>
<html>

  <head> </head>
  <body>

    <menu>
      <menuitem>Item 01 - Tea</menuitem>
      <menuitem>Item 02 - Pasta</menuitem>
      <menuitem>Item 03 - Biryani</menuitem>
      <menuitem>Item 04 - Cookies</menuitem>
    </menu>

  </body>
</html>

menuitem {
        display: block;
        background-color: #84dde4;
        margin-top: 1px;
      }

codemirror

How to use a menu element in HTML

Suitable for toolbars, commands, and context menus, the HTML <menu> element organizes items in a non-numerical list format.