?? 完美解决table中td里面的内容自动换行-三体亚博国际开户 亚博国际开户,亚博体育在线app,亚博体育正规
文章目录

完美解决table中td里面的内容自动换行

对于将td里面的内容自动换行,在很久以前就遇到的了,但是一直没有完美的解决。

今天要打印一个报表,有一列中的内容太长,将table撑得老长实在是影响观感。

于是下决心一定要解决td内容自动换行的问题。

网上有很多说可以解决的,大致有以下几种。

1、在table中加table-layout:fixed;

2、在td中加word-wrap:break-word;word-break:break-all;

但是都能不解决问题。

解决方法如下:

在显示长内容的td里面将内容放在div标签里面。

给div标签加样式

style="width:100%;white-space:normal;word-wrap:break-word;word-break:break-all;"

实例如下:

html代码

 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
 ? ?
订单编号回团日期买家昵称宝贝属性实付款已收款成本价(RMB)接单人
ZH2018062622495442982018-08-25XP丐帮帮主
布先生 字母印花 新品短袖男 潮流印花圆领男士上衣
1656.00801300.00李小洁
ZH2018073021544183782018-07-31来不及说123
ins超火的雪纺衬衣女夏季2018韩范新款宽松喇叭袖白色衬衫上衣服
798.00600.00陈海川
ZH2018073109312280872018-07-31流雨的花
NASO那所 北欧铁艺家用大号带盖脏衣篮衣服收纳筐 欧式简约脏衣篓
1965.001460.00李胜男
ZH2018072611154758792018-07-31吹花风雪abc
防水折叠脏衣篮布艺脏衣篓带盖脏衣服收纳筐北欧家用大号洗衣篮子
3.0040.00林杉杉

亲自测试一下

经测试以上代码可以兼容firefox、谷歌、360浏览器,td里面的内容都能自动换行,至于那些老的浏览器没有测试。

完美解决table中td里面的内容自动换行

本文网址:http://www.santii.com/article/215.html

?
数据更新时间:2019-08-11