layui表格宽度不自适应

最新推荐文章于 2023-11-02 10:41:11 发布

Jarven_ma

最新推荐文章于 2023-11-02 10:41:11 发布

阅读量5.6k

点赞数

分类专栏：前端标签文章标签： html javascript

本文链接：https://blog.youkuaiyun.com/Jarven_ma/article/details/106373739

版权

前端标签专栏收录该内容

10 篇文章

订阅专栏

在使用layui框架创建表格时，遇到表格内容无法自适应宽度的问题。通过调试发现，设定表格序号字段导致宽度不能自动分配。去掉序号字段后，表格宽度恢复正常自适应。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本人在使用layui创建表格时候，发现设定了表格的内容，没有设定宽度发现宽度就是不自动分配宽度了，调试了半天删掉了css也不行，去官网看了一下，设定了表格的基础宽度也不行，除非设定表格的固定宽度否则永远是挤在一起，如下图所示：

表格内容永远挤在一起，经过一番折腾再咨询了一下前辈，发现罪魁祸首就是这个序号字段，把序号去掉之后宽度就自适应了

cols : [[{
			type: 'numbers', 
			title: '序号' ,
			minWidth:'60'
		}, {
			field : 'xxxx',
			title : '用户名' 
		},{
			field : 'xxx',
			title : '真实姓名' 
		},  {
			field : 'xxx',
			title : '所属部门' 
		}, {
			field : 'xxx',
			title : '用户角色' 
		}, {
			field : 'xxx',
			title : '创建时间'
		}, {
			title : '操作',
			width : '200',
			fixed : 'right',
			toolbar : '#bar'
		}]]