专业编程教程与实战项目分享平台

网站首页 > 技术文章 正文

前端经验-如何在p元素中展示固定行数的文字，超出部分显示省略号

ins518 2024-12-27 14:01:14 技术文章 33 ℃ 0 评论

1 说明

最近项目上有个需求，就是有一个网站列表，每个网站下面要加上一段简介，简介文字有行数限制，超出行数以后后面的文字用省略号显示。

2 CSS代码

.websiteul p {
    margin: 5px 3px;
    font-size: 14px;
    color: #555;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4; /*设置p元素最大可以显示4行文字*/
    -webkit-box-orient: vertical;
}

3 效果图

Tags：

猜你喜欢

本文暂时没有评论，来添加一个吧(●'◡'●)

欢迎 你 发表评论:

最近发表
标签列表