HTML <메뉴> 태그
예시
다양한 <menuitem> 요소가 있는 컨텍스트 메뉴:
<menu type="context" id="mymenu">
<menuitem label="Refresh" onclick="window.location.reload();" icon="ico_reload.png">
</menuitem>
<menu label="Share on...">
<menuitem label="Twitter" icon="ico_twitter.png"
onclick="window.open('//twitter.com/intent/tweet?text='+window.location.href);">
</menuitem>
<menuitem label="Facebook" icon="ico_facebook.png"
onclick="window.open('//facebook.com/sharer/sharer.php?u='+window.location.href);">
</menuitem>
</menu>
<menuitem label="Email This Page"
onclick="window.location='mailto:?body='+window.location.href;"></menuitem>
</menu>
정의 및 사용
<menu> 태그는 명령의 목록/메뉴를 정의합니다.
<menu> 태그는 상황에 맞는 메뉴, 도구 모음 및 양식 컨트롤 및 명령을 나열하는 데 사용됩니다.
브라우저 지원
표의 숫자는 요소를 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.
Element | |||||
---|---|---|---|---|---|
<menu> | Not supported | Not supported | 8.0 (only context menus) |
Not supported | Not supported |
참고: <menu> 태그는 Firefox에서만 지원되며 컨텍스트 메뉴에서만 작동합니다.
팁 및 참고 사항
팁: CSS를 사용하여 메뉴 목록의 스타일을 지정하십시오.
속성
Attribute | Value | Description |
---|---|---|
label | text | Specifies a visible label for the menu |
type | list toolbar context |
Specifies which type of menu to display |
전역 속성
<menu> 태그는 HTML의 전역 속성 도 지원합니다 .
이벤트 속성
<menu> 태그는 HTML의 이벤트 속성 도 지원합니다 .
관련 페이지
HTML DOM 참조: 메뉴 개체
기본 CSS 설정
대부분의 브라우저는 다음 기본값을 사용하여 <menu> 요소를 표시합니다.
menu {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}