CSS实现单行、多行文本溢出隐藏

单行文本溢出

.test{
    width:200rpx;
	overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap;    
}

多行文本溢出

.test{
    overflow: hidden;            // 溢出隐藏
    text-overflow: ellipsis;     // 溢出用省略号显示
    display:-webkit-box;         // 作为弹性伸缩盒子模型显示。
    -webkit-box-orient:vertical; // 设置伸缩盒子的子元素排列方式：从上到下垂直排列
    -webkit-line-clamp:3;        // 显示的行数
}

注意：由于上面的三个属性都是 CSS3 的属性，没有浏览器可以兼容，所以要在前面加一个-webkit- 来兼容一部分浏览器。