多行省略号

单行省略号

width:100px; //设置宽度
max-width:200px; //也可以设置最大宽度
overflow: hidden;//溢出隐藏
white-space: nowrap; // 强制一行显示
text-overflow: ellipsis;// 显示。。。省略号
1
2
3
4
5

多行省略号

width: 100px; //设置宽度
max-width:200px; //也可以设置最大宽度
overflow : hidden;  // 溢出隐藏
display: -webkit-box;    //  自适应布局 弹性伸缩盒子
-webkit-box-orient: vertical; //垂直排列子元素 伸缩盒子的子元素排列
-webkit-line-clamp: 3;   //最多显示几行 多出部分。。。显示
text-overflow: ellipsis; // 显示省略号
1
2
3
4
5
6
7