display: -webkit-box; 盒模型

最新推荐文章于 2023-05-08 23:46:33 发布

原创最新推荐文章于 2023-05-08 23:46:33 发布 · 2.2k 阅读

2 ·

CC 4.0 BY-SA版权

html和css 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一种利用CSS属性实现文本溢出隐藏并限制显示行数的方法，通过设置宽度、文本溢出样式及行数限制等属性，可以有效地控制文本在网页上的展示效果。

     p {
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis; 文本溢出隐藏
        display: -webkit-box; /* 定义为盒子显示 */
        -webkit-box-orient: vertical;  /* 定义为竖向编排显示 */
        -webkit-line-clamp: 2;/* 限制一个块元素显示的文本行数*/
        font-size: .16rem;
      }
    }
上面那些必须联合使用！！！！