CSS实现单行、多行文本溢出显示省略号的方法
程序员文章站
2022-04-11 14:20:08
...
代码实现:
//单行
.single-line{
width:200px;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
}
<p class="single-line"></p>
//多行
.multiple-line{
width:200px;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
overflow:hidden;
}
注意:由于使用的是WebKit的CSS扩展属性,所以该方法只适用于WebKit浏览器及移动端;
以上就是CSS实现单行、多行文本溢出显示省略号的方法的详细内容,更多请关注其它相关文章!
上一篇: 个人学习php的经验讲述
下一篇: CI框架中控制器和控制器内的方法命名