css文字两行或多行显示溢出隐藏

css文字两行或多行显示溢出隐藏,是个非常实用的CSS代码,在实际开发项目中会很常用,这里顺手记录下。

文本溢出影藏显示省略号:

overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;

一行显示溢出省略号

.line-clamp1 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

两行显示多则显示省略号:

.line-clamp2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

大家可以试试,经常用的的朋友可以收藏本文,以免经常百度搜索。。

相关文章

网页设计

简约的线上餐厅送餐点餐服务网页界面设计模板

2020-11-24 20:19:04

CSS/DIV

抖音恶搞视频,我是练习时长两年半的

2020-11-9 15:37:50

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索