<%@page contentType="text/html;charset=utf-8"%>
<%@taglib prefix="s" uri="/struts-tags" %>
<!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">
<%
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath();
%>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/ext-4.2.1.883/resources/css/ext-all.css"/>
 <script type="text/javascript" src="${pageContext.request.contextPath}/ext-4.2.1.883/adapter/ext/ext-base.js"></script>
 <script type="text/javascript" src="${pageContext.request.contextPath}/ext-4.2.1.883/ext-all.js"></script>
  <head>
   <script type="text/javascript">                   /**         * 颜超群         * 2008.05.31         *         *         *菜单         *         * 所在包:   Ext.menu         *         * 所有菜单类:         *      Ext.menu.Adapter            *      Ext.menu.BaseItem           *      Ext.menu.CheckItem         *      Ext.menu.ColorItem         *      Ext.menu.ColorMenu         *      Ext.menu.DateItem         *      Ext.menu.Item         *      Ext.menu.Menu         *      Ext.menu.MenuMgr         *      Ext.menu.Separator         *                         */            /*             * 最常用的菜单类             * Ext.menu.Menu             * 属性:items    可以放菜单包中所有的实例,一般我们常用Ext.menu.Item             *             * Ext.menu.Item属性:             *             * handler      处理函数             * hideDelay    隐藏延迟,默认100毫秒             * hideOnClick  是否点击菜单项后自动隐藏,默认是true             * href         指定链接地址             * hrefTarget   链接打开的发式             * icon         可以指定在菜单项前面显示的图标,默认没有图标             * text         菜单项显示的文本,可以使用Html             *             */                                  Ext.onReady(function(){                               var menu1=new Ext.menu.Menu({                    items:[{                //菜单项的集合                        text:"颜超群",      //菜单项的文本,                        href:"http://jaychaoqun.cnblogs.cn",//指定链接地址                        hrefTarget:"_blank",        //链接打开的发式,在新窗口打开
                    },{                        text:"颜超群",                        href:"http://jaychaoqun.cnblogs.cn",                        hrefTarget:"_blank",
                    },{                        text:"颜超群",                        href:"http://jaychaoqun.cnblogs.cn",                        hrefTarget:"_blank",
                    },{                        text:"颜超群",                        href:"http://jaychaoqun.cnblogs.cn",                        hrefTarget:"_blank",
                    },{                        text:"颜超群",                        href:"http://jaychaoqun.cnblogs.cn",                        hrefTarget:"_blank",
                    },{                        text:"颜超群",                        href:"http://jaychaoqun.cnblogs.cn",                        hrefTarget:"_blank",
                    }]                });                /**                 * 普通菜单                 */                var menu2=new Ext.menu.Menu({                    items:[{                        text:"<b>粗体</b>",                        handler:handlerMenu                    },{                        text:"<i>斜体<i>",                        handler:handlerMenu                    },{                        text:"<u>下划线</u>",                        handler:handlerMenu                    },{                        text:"<font color=red>红色字体</font>",                        handler:handlerMenu                    }]                });                               /**                 * 带子菜单的菜单                 */                var menu3=new Ext.menu.Menu({                    items:[{                        text:"菜单项1",         //菜单项的文本,                                    //子菜单                        menu:{items:[{text:"子菜单1",handler:handlerMenu},{text:"子菜单2",handler:handlerMenu},{text:"子菜单3",handler:handlerMenu}]}                    },{                        text:"菜单项2",                        menu:{items:[{text:"子菜单1"},{text:"子菜单2"},{text:"子菜单3"}]}                    },{                        text:"菜单项3",                        menu:{items:[{text:"子菜单1"},{text:"子菜单2"},{text:"子菜单3"}]}                    }]                });
                var panel= Ext.create('Ext.panel.Panel', { //new 一个Panel 用以显示菜单
                     
                    width:300,          //宽度
                    
                    border:true,       //有边框                    renderTo:"div1",    //显示的位置,在body里的一个div                    tbar:[{text:"导航菜单",menu:menu1},      //把菜单放在Panel的顶部工具栏                        {text:"普通菜单",menu:menu2},                        {text:"带子菜单的菜单",menu:menu3},
                    ]                });                /**                 * 用以处理菜单项点击事件                 * @param {Object} item                 */                function handlerMenu(item){                    Ext.Msg.alert("提示","您点击了"+item.text+"项");                                }            });                </script>
  </head>
<body>
<div align="center" id="div1"></div>
</body>
</html>效果图:
怎么样让效果图上的菜单变为竖着排的,谢谢extjsstylesheetfunctionstringobject