首页 > 代码库 > 设置Div多行文本超出时，以省略号代替
设置Div多行文本超出时，以省略号代替
这个文章不错 http://www.css88.com/archives/5206
css中有一个属性： text-overflow，可以设置文本超出指定长度后的文本截取样式。
下面是从 w3shcool截的图：
但是 text-overflow 有一个缺陷，它只能对单行文本起效果，如果是多行文本就不好使了。
如果想对多行文本也实现以省略号代替超出部分的话，可以使用下面方法（貌似局限于webkit内核）：
max-height:100px; /*首先设置div高度*/overflow:hidden; /*设置超出部分隐藏*/text-overflow:ellipsis; /*然后设置文本隐藏方式*//*为了实现多行文本也有效果要设置如下3个属性，具体属性的含义我还不是很清楚：*/display:-webkit-box;-webkit-line-clamp:3; /*只显示3行，如果不设置这个属性，会出现文本被拦腰截断的现象*/-webkit-box-orient: vertical;
最后的效果：
设置Div多行文本超出时，以省略号代替
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。