核心代码 1 2 3 4 5 6 7 8 9 10 11 table{ width:100px; table-layout:fixed;/* 只有定义了表格的布局算法为fixed,下面td的定义才能起作用。 */ } td{ width:100%; word-break:keep-all;/* 不换行 */ white-space:nowrap;/*
核心代码
补充1.table表格想要设置文本溢出操作可按照如下方法
注意:table必须设置table-layout:fixed;属性,文本溢出设置才能生效;
其中:table-layout取值为: 注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 “inherit"。 text-overflow取值为 clip 修剪文本。 标签 nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 标签为止。 pre-wrap 保留空白符序列,但是正常地进行换行。 pre-line 合并空白符序列,但是保留换行符。 inherit 规定应该从父元素继承 white-space 属性的值。 注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 “inherit"。 注意:如果表格中有th和td标签,必须都设置宽度,如果给th设置宽度,td宽度不设置,那么设置table-layout:fixed;文本溢出生效后,td宽度将失效。 2.设置鼠标移动到上面显示全部内容,(1)非table表格可直接使用:hover进行相应设置 (2)table表格利用js设置方法
table表格中重点为设置table{table-layout:automatic},用hover进行操作文本内容会超出表格,不换行。 |
2021-04-14
2021-04-29
2018-01-07
2022-06-10
2021-09-30