首页 前端知识 CSS超出两行隐藏,但第三行仍然会溢出部分文字

CSS超出两行隐藏,但第三行仍然会溢出部分文字

2024-06-18 09:06:12 前端知识 前端哥 868 215 我要收藏

超出隐藏代码:

/* 文字超出两行展示省略号 */
.school-info-show {
  .two-row-hide {
  white-space: normal;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}

原本页面使用方式,出现第三行部分溢出:

<div class="school-info-show font14">{{item.name}}</div>

解决方案(修改后):

<div class="font14">
  <span class="school-info-show">{{item.name}}</span>
</div>

转载请注明出处或者链接地址:https://www.qianduange.cn//article/12599.html
标签
评论
发布的文章

jQuery基本使用

2024-06-24 02:06:16

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!