css单行及多行文字超出部分显示省略号

最新推荐文章于 2024-08-22 11:20:46 发布

weetch

最新推荐文章于 2024-08-22 11:20:46 发布

阅读量1k

点赞数

分类专栏：前端开发文章标签： css

本文链接：https://blog.csdn.net/u011088792/article/details/76215364

版权

本文介绍了如何使用CSS实现单行和多行文字超出显示省略号的效果，多行文字的省略号功能目前仅适用于WebKit浏览器。

摘要由CSDN通过智能技术生成

单行文字

overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

效果:

html

<div class="container">
    <p>思念是一种眷恋，也是一份无奈，是最后的相信，是错过的无奈，孤独一个人的世界，藏着太多的悲伤，一个人看海，一个人想起，最后错过的爱情风雨，只是孤独的世界，苍老的年华，一个人一段繁华，藏着人生的梦，藏着最后的孤独，只是人生的错，错过爱情的包围，一个人淡泊。</