赞赏作者
扫一扫支付
韶华小苑 |

时光不负终不老

您现在的位置是: 首页 >

一行或多行文本溢出隐藏并显示省略号

一行或多行文本溢出隐藏并显示省略号

作者:小美女 日期:2020-07-22 点击:7

1. 让文本内容在一行显示,并且超出部分用省略号显示

.demo {
    white-space: nowrap; /*让所有文本在一行显示*/
    overflow: hidden; /*超出部分隐藏*/
    text-overflow: ellipsis; /*超出部分用省略号显示*/
}

2. 多行文本超出部分隐藏并用省略号显示

.demo {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;/*文本内容用几行显示*/
    overflow: hidden;
    text-overflow: ellipsis;
}

最后修改时间:2020-07-22 11:26:38

瞅我来气不?用红包砸死我吧