<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<table style="width: 100px;border: solid 1px;">
<tr>
<td style="height: 30px;width: 100px;">呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵</td>
<!-- <td style="height: 30px;width: 100px;">呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。</td> -->
</tr>
</table>
</body>
</html>
结果:
问题: 如果是打开注释的地方,td 会被撑开。请问怎么处理呢?
要求:
1 宽度 100px 不能撑开
2 可以是多行,但是文字内容要显示全
1
TomatoYuyuko 2018-08-28 10:50:59 +08:00
overflow:hidden;
white-space:nowrap; text-overflow:ellipsis; 在设置 td 的 title,想看全 hover 一下或者做成点击弹出层显示全部内容。这样最美观 |
2
checgg OP @TomatoYuyuko 不能 hidden。
如果业务需要这个东西打印出来呢。。。。 |
4
gzf6 2018-08-28 11:08:46 +08:00
table { table-layout: fixed }
|
5
TomatoYuyuko 2018-08-28 11:11:41 +08:00
@checgg 如果是点击按钮执行打印的话,就调底层再去生成一张表,别用前端这张 table,底层打印出来的表可以随便一点显示,不用顾忌溢出换行之类的。
如果是直接打印整个 web 页面那没办法了,丑就丑点吧,,, |
6
murmur 2018-08-28 11:12:14 +08:00
table 不适合布局
自适应太迷幻 要么里面放 div 写死宽度 要么用 flex 这种高档东西 |
7
Sparetire 2018-08-28 14:36:23 +08:00 via Android
4 楼正解
|
9
rabbbit 2018-08-28 18:31:57 +08:00
|
10
Sparetire 2018-08-28 19:52:07 +08:00 via Android
@checgg 当然会到外面去,但这符合解决你说的 td 撑开的问题的要求,至于内容会溢出,这又是另一个问题了,需要另外的解决手段
|
11
loy6491 2018-08-28 20:17:48 +08:00 via iPhone
word-break: break-all
是想找这个嘛 |
13
azh7138m 2018-08-28 22:48:57 +08:00
|