css实现单行文本溢出显示省略号

1
2
3
white-space: nowrap;  		// 规定段落中的文本不进行换行
overflow: hidden; 		// 溢出隐藏
text-overflow: ellipsis;	// 文本溢出显示省略号

css实现多行文本溢出显示省略号

1
2
3
4
5
display: -webkit-box; 		// 设置弹性盒子模型
overflow : hidden;		// 溢出隐藏
text-overflow: ellipsis;	// 文本溢出显示省略号
-webkit-line-clamp: 2;		// 限制在一个块元素显示的文本的行数
-webkit-box-orient: vertical; 	// 属性规定框的子元素应该被水平或垂直排列。

注：因为用了webkit的私有属性，建议只在移动端使用。