如何实现隐藏多余的字用省略号代替

来源：懂视网责编：小采时间：2020-11-27 18:50:05

如何实现隐藏多余的字用省略号代替

如何实现隐藏多余的字用省略号代替:在前端经常会遇到类似的效果。比如图中的风花雪月与古镇火山-.....后面....就是一段文字显示不下的时候默认隐藏然后用…来代替。只需要给元素加上以下3个css属性就可以实现了。 overflow: hidden;//多余的隐藏 text-overflow:el

推荐度：

点击下载本文 文档为doc格式

导读如何实现隐藏多余的字用省略号代替:在前端经常会遇到类似的效果。比如图中的风花雪月与古镇火山-.....后面....就是一段文字显示不下的时候默认隐藏然后用…来代替。只需要给元素加上以下3个css属性就可以实现了。 overflow: hidden;//多余的隐藏 text-overflow:el

在前端经常会遇到类似的效果。比如图中的“风花雪月与古镇火山-.....”后面“....”就是一段文字显示不下的时候默认隐藏然后用…来代替。
这里写图片描述
只需要给元素加上以下3个css属性就可以实现了。

 overflow: hidden;//多余的隐藏 
 text-overflow:ellipsis;//多出来的用省略号代替 
 white-space: nowrap;//不换行

声明：本网页内容旨在传播知识，若有侵权等问题请及时与本网联系，我们将在第一时间删除处理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

如何实现隐藏多余的字用省略号代替

推荐度：

点击下载本文 文档为doc格式

标签：文字做到省略号

热门焦点

如何实现隐藏多余的字用省略号代替

如何实现隐藏多余的字用省略号代替

如何实现隐藏多余的字用省略号代替

最新推荐

猜你喜欢

热门推荐