所有文字显示在一行,溢出部分显示…
/*
1.让文字一行显示,即不换行
2.溢出隐藏
3.溢出文字显示...
*/
.text {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
文字多行显示,溢出部分显示…
/*
1.溢出隐藏
2.溢出文字显示...
3.将对象作为弹性伸缩盒子模型显示
4.设置伸缩盒子的子元素排列方式,此处设置为从上到下垂直排列子元素
5.显示的行数
*/
.text2 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}