bootstrap table 表格太宽,table设置宽度width无效的width属性不起作用怎么办

一般在使用BootstrapTable 插件的时候我是不凅定高度的,没有height属性时候的插件一切正常表格对齐也没有问题。但是为了将页面撑开使数据少的时候,页面不显得空荡所以就固萣了高度:

利用bootstrap的table布局 表格只有两列,想限制前一列的的最大宽度可是发现table设置宽度width无效的max-width没有起到印象中的作用。 注意着基本是我所有的html,css代码,也没有js干扰

根据上图的滚动条可以发现消費详情这列的数据的长度特别长,所以导致了页面出现了滚动条在实际的应用中,页面水平方向使用滚动条去观察数据是较为不方便的所以我们需要将此列的数据换行显示。

第一时间想到的是将表格的标题头table设置宽度width无效宽度我们可以table设置宽度width无效固定宽度,也可以table設置宽度width无效百分比宽度我这里是table设置宽度width无效的百分比宽度,上代码

我给“消费详情”这一列table设置宽度width无效了70%的宽度比,清除浏览器页面缓存刷新页面发现还是一样的问题。宽度比根本没起作用!

再次清除缓存刷新页面

发现页面的宽度已经固定了,这就解决了table设置宽度width无效宽度不起作用的问题但是“消费详情”这列的数据还是有问题,我们只固定了标题头但是数据还是没有换行显示!

注:此屬性的含义是如果单元格内的数据在被列宽限制的情况下会换行显示。

注:以下两个样式分别解决了列table设置宽度width无效宽度不起作用的问题與数据不换行的问题

我要回帖

更多关于 table设置宽度width无效 的文章

 

随机推荐