首页前端开发HTML设置table中的宽度不随文字改变让其固定

设置table中的宽度不随文字改变让其固定

时间2024-01-27 10:14:03发布访客分类HTML浏览196
导读:收集整理的这篇文章主要介绍了设置table中的宽度不随文字改变让其固定,觉得挺不错的,现在分享给大家,也给大家做个参考。 页面中table宽度设置width="600px"之后,宽度仍然不是固定的,文字太长后不换行,把table都...
收集整理的这篇文章主要介绍了设置table中的宽度不随文字改变让其固定,觉得挺不错的,现在分享给大家,也给大家做个参考。 页面中table宽度设置width="600px"之后,宽度仍然不是固定的,文字太长后不换行,把table都撑变形了。

解决办法:

1.table 设置 宽度,绝对宽度和相对都可以

table-layout:fixed ;
设置了这个属性,其余所有td都是相同的宽度。

这样操作之后,table是宽度固定了,但是里面的文章如果很长,文字会覆盖

解决办法:

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

在td上面加

复制代码代码如下:
overflow:hidden;
whITe-space:nowrap;

text-overflow:ellipsis; (目前仅在IE8测试通过)
推荐方法(2013-11-14 by 张雷)用div控制td的内容

在TD中加

(1)超过宽度和高度文字会自动隐藏

复制代码代码如下:
div style="width:100px; height:25px; overflow-x:hidden; overflow-y:hidden; "> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa/div>

(2)设置了td的宽度超过长度自动换行

复制代码代码如下:
td> div style="width:100px; word-wrap:break-word; " > aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa/div>
/td>

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

table

若转载请注明出处: 设置table中的宽度不随文字改变让其固定
本文地址: https://pptw.com/jishu/588066.html
dom操作表格示例(dom创建表格) html元素遮挡flash详解示例

游客 回复需填写必要信息