CSS隐藏多余的文字并用省略号显示

最新推荐文章于 2025-04-27 16:54:52 发布

-Ali

最新推荐文章于 2025-04-27 16:54:52 发布

阅读量668

点赞数

分类专栏： css

本文链接：https://blog.youkuaiyun.com/weixin_47492981/article/details/106243191

版权

css 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一种使用CSS样式来处理文本溢出的方法，通过设置宽度、字体大小、隐藏溢出文字并用省略号表示，适用于网页布局中对文字长度有限制的场景。

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

<!DOCTYPE html>
<html >
<head>
    <meta charset="UTF-8">
    <title>Document</title>

    <style>
        p {
    width: 120px;   
    font-size: 12px;
    overflow: hidden; 
    white-space: nowrap;  
    text-overflow: ellipsis; 
}
    </style>
</head>
<body>
    <p>css隐藏多余的文字并用省略号显示</p> 
</body>
</html>