文字超长自动加省略号的css写法

网上找到大部分说的是加上：

overflow: hidden;
text-overflow: ellipsis;
width: 100px;
white-space: nowrap;

这个css，有些是专指table中的td，有些是指span。但是直接拿过来又好像不好用。所以我在这里总结一下。

1.在table的td中

  在table要达到此目的，首先，table一定要设置它的样式：table-layout: fixed;然后再在指定的td上应用上面的样式。注意这里的width不一定有效，因为table-layout指定为fixed时，td的宽度只受第一行的对应列td的宽度影响。具体请参见w3c school:http://www.w3school.com.cn/css/pr_tab_table-layout.asp

2.在块级元素中

    这里为什么说块级呢，因为在span,a这样的元素中是似乎是不生效的。除非你把它他们的display设置成block。那有没有办法在保留其内联特性的同时，又达到我们要的目的呢。是可以的，这时候inline-block就派上用场了。也就是，如果需要应用在a,span这样的内联元素上，就要额外加上

display:inline-block

这个css属性。注意：inline-block 这个css属性似乎也是有兼容性的，这里就不讨论它，详情请谷歌。

原文网址：http://sudodev.cn/articles/119.html