`

设置table宽度,使其不随内容变宽

    博客分类:
  • CSS
阅读更多

页面中table 宽度设置width="600px"之后,宽度仍然不是固定的,当td的内容太多时,也不会换行,把table都挤变形了。

解决方法:

1.设置table的width属性,绝对宽度和相对宽度都可以

2.给table添加table-layout:fixed; 属性

第一行的<td>设置宽度,留一个不设,自由伸缩。

3.在td里面加上 style="word-wrap:break-word;" 自动换行,如果不想换行,可以将超出的内容设为隐藏,可以用省略号代替:

在td上面添加:

overflow:hidden;
white-space:nowramp;
text-overflow:ellipsis;

 

分享到:
评论

相关推荐

    JS手动改变table的宽度

    JS手动改变table的宽度,鼠标选中文字查询,例如浏览器自带的

    任意改变table表格td的宽度 支持表格TD拖拽

    任意改变table表格td的宽度 动态td的宽度 任意改变table表格td的宽度 动态td的宽度 任意改变table表格td的宽度 动态td的宽度

    vue-easytable@2.16.3版本 拖动列 动态改变列宽大小实现

    实现效果:左键拖动表头右边框出现垂直于表格内的虚线作为参照,按住鼠标左键可左右移动虚线也会跟着移动,拖动到合适位置松开左键,虚线消失,拖动的表格该列 变宽/变窄 到鼠标位置,最窄为50px,最宽为600px,限制...

    HTML页面自适应宽度的table(表格)

    将所有列设置为固定宽度,显然是不能满足此类要求的,但是若把全部的列都设置为百分比,恐怕在某些尺寸,或分辨率下,会变得很难看。比较习惯于用如下的方式来处理——在表格列数不是很多的前提下——将大部分列宽...

    layui表格 列自动适应大小失效的解决方法

    今天小编就为大家分享一篇layui表格 列自动适应大小失效的解决方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

    html 列表列宽可伸缩js

    js实现table标题栏宽度可变,随着鼠标的拖动选定宽度可伸缩

    《程序天下:JavaScript实例自学手册》光盘源码

    9.15 表格设置为“100%”时获取表格的宽度 9.16 表格选中后变色 9.17 表格中隐藏下级表格 9.18 表格自动下移 9.19 动态创建固定列数的表格 9.20 动态改变表格列宽 9.21 动态改变表格的行顺序 9.22 动态生成包含合并...

    程序天下:JavaScript实例自学手册

    9.15 表格设置为“100%”时获取表格的宽度 9.16 表格选中后变色 9.17 表格中隐藏下级表格 9.18 表格自动下移 9.19 动态创建固定列数的表格 9.20 动态改变表格列宽 9.21 动态改变表格的行顺序 9.22 动态生成包含合并...

    css入门笔记

    保持设置的宽高 box-sizing:border-box; 1、内边距 padding 取值:left左 right右 top上 bottom下 px (%)少用 取值:auto 则内容居中 2、外边距margin 6、背景颜色 1.背景色 属性:background: 取值:颜色...

    从入门到精通HTML5——PDF——网盘链接

     3.4.2 设置水平线的宽度与高度  ——width、height 57  3.4.3 设置水平线的颜色——color 58  3.4.4 设置水平线的对齐方式——align 59  3.4.5 去掉水平线阴影——noshade 60  3.5 其他文字标记 60  3.5.1 ...

    X格插件 for discuz 7.0

    B、修正:插件宽自动适应宽度!C、修正:升级后点击图片,不能弹出的问题!之前安装的用户按下面的方法就可以了,新下载的用户不须要!1、打开 templates/default/discuz.htm 找{eval @include_once(DISCUZ_ROOT.'...

    Report machine 2.4

    - 报表增加选项(布缩放边框宽度),可以防止表格线变粗;; - Printer单元作了大量修改,Windows2000下支持自定义纸张. v1.1 - 对DataManger作了大量修改,现支持各种数据存取控件(直接支持BDE,ADO,IBX,...

    rm2.6正式版本

    - 报表增加选项(布缩放边框宽度),可以防止表格线变粗; - Printer单元作了大量修改,Windows2000下支持自定义纸张. &lt;br&gt; v1.1 - 对DataManger作了大量修改,现支持各种数据存取控件(直接支持BDE,...

    单片机期末考试题目及答案详解

    在定时器工作方式0下,计数器的宽度为 位,其记数范围为 ,如果系统晶振频率为6MHZ,则最大定时时间为 。 22.利用定时器/计数器产生中断时,应把定时器/计数器设置成 工作状态,当计数器设置成方式0时,记数初值应...

    HGE_系列教材(1-9)

    // 设置不使用声音 pHge-&gt;System_SetState(HGE_USESOUND, false); // 设置标题为"Minimal HGE" pHge-&gt;System_SetState(HGE_TITLE, "Minimal HGE"); 最后需要调用函数System_Initiate 来完成初始化操作,这个函数...

Global site tag (gtag.js) - Google Analytics