EasyUi 表格自适应宽度
2024-10-19 18:21:43
第一次接触EasyUi想要实现表格宽度自适应,网上找了好多文章,都没有实现,有网友实现了可是自己看不懂。可能是太简单高手都懒得分享,现在把自己的理解和实现记录一下,希望可以帮到向自己一样的菜鸟,步骤如下:
第一步,把table标签的属性“fitColumns”设置为“true”
第二步,经过第一步的设置后,此时给标题的td设置width属性,width的值此时设置为数字代表的就是宽度按百分比来设置,例如width:10,表示宽度为10%
代码如下:
<table class="easyui-datagrid" style="width:100%;"
data-options="singleSelect:true,collapsible:true,url:'demo/datagrid/datagrid_data1.json',method:'get',fitColumns:true">
<thead>
<tr>
<th data-options="field:'itemid',width:10">Item ID</th>
<th data-options="field:'productid',width:20">Product</th>
<th data-options="field:'listprice',width:10,align:'right'">List Price</th>
<th data-options="field:'unitcost',width:10,align:'right'">Unit Cost</th>
<th data-options="field:'attr1',width:40">Attribute</th>
<th data-options="field:'status',width:10,align:'center'">Status</th>
</tr>
</thead>
</table>
最新文章
- ajax里面success函数return上层接收不到
- 制作本地 odoo deb包安装镜像
- 【Jenkins】jenkins简单搭建并执行任务
- Neither BindingResult nor plain target object for bean
- Socket&;GCDAsyncSocket(异步Socket)
- 20145103 《Java程序设计》第2周学习总结
- linux下安装cmake和mysql遇到的问题总结
- label 不同颜色
- 搭建LAMP及wordpress
- Ansible(三) - playbook简介
- 王立平--WebView的缓存机制
- Object-C与Swift混合开发
- Android逆向之smali学习
- mysql-语法大全
- HTML5 Canvas制作雷达图实战
- 利用 AttachThreadInput 改变其它进程的输入法状态
- myeclipse调用loadrunner函数开发测试脚本
- 【Javascript】Javascript原型与继承
- 一起talk GDB吧(第五回:GDB查看信息)
- vue指令详解
热门文章
- BZOJ 3319: 黑白树 并查集 + 离线 + 思维
- 开始玩矩阵了!先来一道入门题![SDOI2008]递归数列
- .NET(c#) 移动APP开发平台 - Smobiler(2) - 平台介绍
- C#判断网络链接状态
- Android环境配置之正式版AndroidStudio1.0
- activeMQ安全机制
- [LOJ2288][THUWC2017]大葱的神力:搜索+背包DP+费用流+随机化
- 笨办法学Python(learn python the hard way)--练习36-37
- CSS札记(一):CSS选择器
- 【洛谷T2695 桶哥的问题——吃桶】