当表格遇上单行溢出省略显示

通常,使用单行溢出省略显示,我们都会这样写:

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

但是当需要在table表格中使用时,有没有发现根本不生效?

文字内容就是要把表格继续撑开,而不是省略显示。

因为单元格的流动性,使得文字根本就不存在溢出这种说法。


解决方法也很简单,给最外面的table标签添加一个声明就可以了。

 

table-layout: fixed;

 

table-layout: fixed的作用在于,让表格布局固定,也就是表格的宽度不是跟随单元格内容多少自动计算尺寸。

 

posted @ 2016-05-12 17:54  Joy Ho  阅读(388)  评论(0编辑  收藏  举报