我们先来看看效果如何？
通过简单的学习，我发现必须注意如下几点：
注意：1.class="easyui-menu"这个必须有，据我猜测，他就是控制菜单的背景样式，但是我查看css却没有这个，很是奇怪,希望知道的朋友们告诉我一下，在此表示感谢。如果不引用这个样式无法达到菜单效果，一开始学习这个控件的时候没有找到原因，还以为自己代码写错了，查来查去就是不知道什么地方写的不对，只好看他们的例子，最终知道是这个原因。
2.icon很明显的就是图标的意思，在这里就是设置图标的样式。自己老是忘记icon这个属性，结果自己每次都把类似的icon="icon-edit"写成class="icon-edit"。我发现样式照样能够显示的很好，真是不知道为什么？
3.看来名称外面必须使用div标签，其他标签测试了许多个都是无效的。
完整代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>创建一个简单的菜单</title>
<link rel="stylesheet" type="text/css" href="themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="themes/icon.css" />
<script type="text/javascript" src="jquery-1.4.2.min.js">
</script>
<script type="text/javascript" src="jquery.easyui.min.js">
</script>
<script type="text/javascript">
$(document).ready(
function () {
$('#mymenu').menu('show', {
left: 300,
top: 180
});
}
);
</script>
</head>
<body>
<div id="mymenu" style=" 120px;" class="easyui-menu">
<div icon="icon-ok">
文件
<div style=" 150px;">
<div>
新建项目
</div>
<div>
新建网站
</div>
</div>
</div>
<div class="menu-sep">
</div>
<div icon="icon-edit">
编辑</div>
<div class="menu-sep">
</div>
<div icon="icon-redo">
视图</div>
<div class="menu-sep">
</div>
<div>
网站</div>
</div>
<p style=" 500px; border: 1px solid #ccc; font-size: 12px; text-indent: 27px;
line-height: 18px; padding: 5px;">
<font color="red">注意：</font>1.class="easyui-menu"这个必须有，据我猜测，他就是控制菜单的背景样式，但是我查看css却没有这个，很是奇怪,希望知道的朋友们告诉我一下，在此表示感谢。如果不引用这个样式无法达到菜单效果，一开始学习这个控件的时候没有找到原因，还以为自己代码写错了，查来查去就是不知道什么地方写的不对，只好看他们的例子，最终知道是这个原因。
<br />
2.icon很明显的就是图标的意思，在这里就是设置图标的样式。自己老是忘记icon这个属性，结果自己每次都把类似的icon="icon-edit"写成class="icon-edit"。我发现样式照样能够显示的很好，真是不知道为什么？
<br />3.看来名称外面必须使用div标签，其他标签测试了许多个都是无效的。
<br />
</p>
</body>
</html>