最新的Web开发教程
 

HTML <menu> Tag


不同的上下文菜单<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>标签用于上下文菜单,工具栏和上市表单控件和命令。


浏览器支持

在表中的数字指定完全支持元件的第一个浏览器的版本。

元件
<menu> 不支持 不支持 8
(仅限上下文菜单)
不支持 不支持

注: <menu>标签只支持在Firefox中,它仅适用于上下文菜单。


提示和注意

提示:使用CSS样式菜单列表。


HTML 4.01和HTML5之间的差异

<menu>元素被弃用的HTML 4.01。

<menu>元素在HTML5重新定义。


属性

=新的HTML5。

属性 描述
label text 指定一个可见标签的菜单
type list
toolbar
context
指定菜单的类型要显示的

全局属性

<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;
}