번역이 완료되지 않았습니다. Please help translate this article from English
This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
HTML <menu> 요소는 사용자가 수행하거나 하는 명령 묶음을 말합니다. 이것은 스크린 위에 나오는 목록 메뉴와 눌려진 버튼 아래에 나오는 것과 같은 맥락 메뉴를 포함합니다.
| Content categories | Flow content. Additionally, if in the list menu state, palpable content. (list menu is the default state, unless the parent element is a <menu> in the context menu state.) |
|---|---|
| Permitted content | If the element is in the list menu state: flow content, or alternatively, zero or more occurrences of <li>, <script>, and <template>.If the element is in the context menu state: zero or more occurrences, in any order, of <menu> (context menu state only), <menuitem>, <hr>, <script>, and <template>. |
| Tag omission | None, both the starting and ending tag are mandatory. |
| Permitted parent elements | Any element that accepts flow content. |
| DOM interface | HTMLMenuElement |
속성
이 요소는 전역 속성을 포함합니다.
label- 사용자에게 보여지는 메뉴의 이름입니다. Used within nested menus, to provide a label through which the submenu can be accessed. Must only be specified when the parent element is a
<menu>in the context menu state. type- This attribute indicates the kind of menu being declared, and can be one of two values.
context: The context menu state, which represents a group of commands activated through another element. This might be through themenuattribute of a<button>, or an element with acontextmenuattribute. When nesting<menu>elements directly within one another, this is the missing value default if the parent is already in this state.list: The list menu state, which represents a series of commands for user interaction. This is the missing value default, except where the parent element is a<menu>in the context menu state.
Examples
Example 1
<!-- A button, which displays a menu when clicked. --> <button type="menu" menu="dropdown-menu"> Dropdown </button> <menu type="context" id="dropdown-menu"> <menuitem label="Action"> <menuitem label="Another action"> <hr> <menuitem label="Separated action"> </menu>
Result
Example 2
<!-- A context menu for a simple editor, containing two menu buttons. -->
<menu>
<li>
<button type="menu" value="File" menu="file-menu">
<menu type="context" id="file-menu">
<menuitem label="New..." onclick="newFile()">
<menuitem label="Save..." onclick="saveFile()">
</menu>
</li>
<li>
<button type="menu" value="Edit" menu="edit-menu">
<menu type="context" id="edit-menu">
<menuitem label="Cut..." onclick="cutEdit()">
<menuitem label="Copy..." onclick="copyEdit()">
<menuitem label="Paste..." onclick="pasteEdit()">
</menu>
</li>
</menu>
Result
명세
| Specification | Status | Comment |
|---|---|---|
| HTML Living Standard The definition of '<menu>' in that specification. |
Living Standard | |
| HTML 5.1 The definition of '<menu>' in that specification. |
Recommendation | Initial definition |
브라우저 호환성
같이 보기
- Other list-related HTML Elements:
<ol>,<ul>,<li>and the obsolete<dir>. - The
contextmenuglobal attribute can be used on an element to refer to theidof amenuwith thecontexttype.