使用EazyUI 布局的时候左边菜单来回显示隐藏之后最后会主体部分会出滚动栏
如图:
出现这样的问题之后 发现自己tab代码无问题 内容页面也都是100%的,感觉没问题。可是不知道他的机制是怎么样的 后经过大神点播 里面内容页 也须要加个布局控件
改动之后
代码
<p><%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %></p><p><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <%--公用页面 --%> <%@ include file="../Common/headnormal.jsp"%> <%--本页面相关引用文件 --%> <script type="text/javascript" src="../../App_JS/CodeFactory/codefactory.js"></script> </head></p><p><body> <div class="easyui-layout" fit="true"> <div data-options="region:'north',border:false" style="height:100px;padding:2px 2px 1px 2px;"> <div class="easyui-layout" fit="true"> <div data-options="region:'north',border:false" style="padding-bottom: 2px;"> <div class="panel-header" style="padding:1px;"> <a href="#" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-standard-application-form-add'">加入</a> <a href="#" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-standard-application-form-edit'">编辑</a> <a href="#" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-standard-application-form-delete'">删除</a> </div> </div> <div data-options="region:'center',border:false" style=""> <div class="easyui-panel" data-options="iconCls:'icon-standard-application-form-magnify',fit:true" title="列表查询">xxx</div> </div> </div> </div> <div data-options="region:'center',border:false" style="padding:1px 2px 2px 2px;"> <div id="dg"></div> </div> </div> </body></p><p></html> </p>
也就是又一次引用了一个eazyui 的layout 上下分的那种 然后里面100%就好了这样就没事了
只是这样会有个小问题 就是 在分辨率过大的电脑 看起来回非常恶心 由于是全屏填充的
做设计Table的时候 给个小提示:
就是 最后一列不加宽度 前面的设置好宽度之后 不狂界面怎么调整 宽度都是一样 然后后面一列会变长和变短,这样做适合不论什么屏幕
当然最后看各种习惯了
主要思路 就是layout 里面继续套layout 这样才干解决左边菜单来回收缩之后出滚动栏的问题
最后效果图