css设置使文字显示2行多余的为省略号...

最新推荐文章于 2023-02-21 16:01:14 发布

原创最新推荐文章于 2023-02-21 16:01:14 发布 · 286 阅读

0 ·

CC 4.0 BY-SA版权

本文深入探讨CSS中的高级样式技巧，包括字体大小、行高、文本溢出处理等，旨在帮助前端开发者掌握更高效的布局和样式控制方法。

.title{
       font-size: .7rem;
       line-height: 1.5rem;
 
       overflow: hidden;  /** 隐藏超出的内容 **/
       word-break: break-all;
       text-overflow: ellipsis; /** 多行 **/
       display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
       -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
       -webkit-line-clamp: 2; /** 显示的行数 **/
       margin-bottom: .3rem;
   }