文字超出该有的宽度呈现~省略号

代码：

p{

    width: 50px;  /*必须设置宽度*/

    overflow: hidden;  /*溢出隐藏*/

    text-overflow: ellipsis; /*以省略号...显示*/

    white-space: nowrap;  /*强制不换行*/

}

这几个缺一不可。

1.text-overflow:ellipsis | clip

ellipsis:出现省略号；
clip:不出现省略号

2.white-space:nowrap | pre-wrap | pre-line

　nowrap:即使文字超出宽度，也不让文字换行

 　pre-wrap:保留空白符序列，但是正常地进行换行

　pre-line:合并空白符序列，但是保留换行符

文字超出该有的宽度呈现~省略号

原文：http://www.cnblogs.com/white-bull/p/7988064.html