css中文本超出部分省略号代替

最新推荐文章于 2023-08-22 18:02:55 发布

转载最新推荐文章于 2023-08-22 18:02:55 发布 · 85 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/lvmylife/p/5339014.html

本文介绍了一种利用CSS实现文本溢出并以省略号显示的方法。通过设置p标签的宽度、white-space、overflow及text-overflow属性，可以使得超出容器宽度的文本以省略号形式展示，适用于网页布局中对文字长度有限制的情况。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

p{

    width: 100px; //设置p标签宽度

    white-space: nowrap; //文本超出P标签宽度不换行，而是溢出

    overflow: hidden; //文本超出P标签，超出部分隐藏

    text-overflow: ellipsis; //CSS3的新属性：显示省略号代替被修剪的文本；其他两个属性：1、clip-修剪文本，2、string-使用给定的字符串来代表被修剪的文本

}

转载于:https://www.cnblogs.com/lvmylife/p/5339014.html