当前位置:首页 > 网页设计 >CSS >

CSS设置多余的文本显示省略号

发布时间:2016-08-18 17:23:30 作者:佚名 阅读:(532)

在web开发过程中,常常会遇到要让布局中的某些文本根据宽度来显示,如果超过最大宽度仍然显示不完的,就显示为省略号的情况,添加下面的CSS样式表就能实现这种效果,但是这种效果只适用于单行显示的文本。

首先给用于放文本的标签元素设置一个宽度值,并设置溢出属性overflow为溢出隐藏。

width: 245px;

overflow: hidden;
 

设置文本缩略的样式为"..."

white-space: nowrap;

text-overflow: ellipsis;

 

欢迎分享转载→ CSS设置多余的文本显示省略号

© 2015-2019 - 吾爱编程网 版权所有 苏ICP备18033726号-1关于我们 - 网站声明 - 联系我们