- 单行:限制文字 一行显示不下时,用省略号‘...’表示
- 方法一:
.test {
/* 溢出隐藏 */
overflow: hidden;
/* 限制一行显示 */
white-space: nowrap;
/* 显示不下省略号显示 */
text-overflow: ellipsis;
- 方法一:
- 方法二::
- 两行:限制文字 两行显示不下时,用省略号‘...’表示
-
.test {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
-
效果图:
- 四行