css文本超出一行或多行显示省略号

全屏阅读
  • 基本信息
  • 作者:
  • 作者已发布:925篇文章
  • 发布时间:2023年04月16日 9:06:32
  • 所属分类:CSS, WEB前端
  • 阅读次数:443次阅读
  • 标签:

CSS文本溢出就显示省略号,很实用的效果,却常常让我忘记样式代码...很尴尬的说,记录一下,方便开发Ctrl+V和Ctrl+C

溢出一行显示省略号:

/*主要复制这三行,基本就有效果,没有效果的话,那得设置具体宽度*/
white-space:nowrap; 
overflow:hidden; 
text-overflow:ellipsis;

 

溢出多行显示省略号(CSS3出的,兼容性自然没溢出一行的好)

overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;/*超出2行就显示省略号,可以填3或者其它正整数*/

 

顶一下
(0)
100%
订阅 回复
踩一下
(0)
100%
» 郑重声明:本文由mpxq168发布,所有内容仅代表个人观点。版权归恒富网mpxq168共有,欢迎转载, 但未经作者同意必须保留此段声明,并给出文章连接,否则保留追究法律责任的权利! 如果本文侵犯了您的权益,请留言。

目前有 0 条留言 其中:访客:0 条, 博主:0 条

给我留言

您必须 [ 登录 ] 才能发表留言!