不同分辨率调整div高度
来源:互联网 发布:java log日志级别 编辑:程序博客网 时间:2024/06/01 08:41
不同分辨率调整div高度
问题
在做easyui 表格页面时,一般是页面上半部分为搜索框部分,有时候由于搜索条件很多,在分辨率下正常的显示成一排,但在低分辨率下,搜索框区域会出现滚动条,而且你设置了不出现滚动条时,则有一部分搜索条件会被隐藏(-.-|最大可能是搜索和重置按钮被隐藏).
ps:这里我没使用table布局,因为table定的太死了,遇到一些极端的问题,变形太严重而且还不好解决,所以我的搜索区域布局为:inlinke-block布局
<div data-options="region:'north'" id="searchPanel" > <form id="searchForm" method="post"> <div style="padding-left: 4px; padding-top:5px;display: inline-block;"> <label>机构名称:</label> <input style="width: 96px;" class="easyui-textbox" name="orgName"></input> </div> <div style="padding-left: 4px; padding-top:5px;display: inline-block;"> <label>机构等级:</label> <select id="search_hospitalLevel" name="hospitalLevel"></select> </div> <div style="padding-left: 4px; padding-top:5px;display: inline-block;"> <label>机构等次:</label> <select id="search_hospitalOrder" name="hospitalOrder"></select> </div> <div style="padding-left: 4px;padding-top:5px;display: inline-block;"> <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-search'" id="btnSearch">查询</a> <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-redo'" id="btnResetSearch">重置</a> </div> </form> </div>
解决
加个样式:
@media screen and (max-width: 1920px){ #searchPanel{height:40px!important} }@media screen and (max-width: 1440x) { #searchPanel{height: 80px!important} }
注意:
max-width并不是分辨率,只是在现有的分辨率你的页面最大可用屏幕宽度
阅读全文
0 0
- 不同分辨率调整div高度
- 兼容在不同浏览器不同分辨率下DIV高度自适应
- 在不同分辨率下用js获取div的高度
- 如何使一个div背景在不同分辨率情况下都能全高度显示
- 在不同分辨率下调整程序窗口
- javascript 调整宽度和高度的div
- CSS调整DIV最小高度问题
- 不同分辨率下Div位置局中
- 让DIV居中,兼容不同分辨率
- 让DIV居中,兼容不同分辨率
- android linearLayout 根据不同的分辨率自动调整 显示大小
- 按分辨率不同调整对话框大小以及控件大小
- Easyui widow 控件 宽度调整适应不同分辨率
- 调整分辨率
- 设置DIV根据内容自动调整高度的三个方法
- css实现div高度根据自适应宽度(百分比)调整
- css控制DIV在底部(可以适应不同分辨率)
- 解决不同分辨率下浮动div层位置问题
- 使用 jQuery 验证密码一致性,正则表达式验证邮箱及手机号的方法
- TextView使用wrap_content设置高度,上下有间隔 去除的方法,两种
- android如何实现开机自动启动Service或app
- redis学习系列(六)--redis基础跳跃表的构造
- 使用Layui搭建后台管理界面
- 不同分辨率调整div高度
- shell 脚本编程学习(一) 基础
- sencha architect3构建web应用程序
- return true false 的区别
- 1134. Vertex Cover (25)
- JSR-356 WebSocket API规范中文版下载
- Java中的可变参数
- php题目将1234567890转化成1,234,567,890每3位用,隔开
- 路由-标签切换