div内文字显示两行，超出两行部分省略号显示css能实现么？

只能在第一行内显示省略，不能在第二行内换行测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试

只能在第一行内显示省略，不能在第二行内换行
<div style="width:200px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试</div>2014-11-24

这个我只能说用css实现不了，提供两种方法，一是用程序输出时截字，二是用js判断字数截取。2014-11-29

通常的做法是这样的：
1.overflow:hidden;
2.text-overflow:ellipsis;
3.-o-text-overflow:ellipsis;
4.white-space:nowrap;
5.width:100%;
其中，overflow: hidden和white-space: nowrap都是必须的否则不会显示省略号；-o-text-overflow: ellipsis针对Opera；而宽度的设定主要是针对IE6；
该方法支持Internet Explorer, Safari, Chrome 和 Opera，但FF并不支持，不过可以通过Jquery来实现类似的效果。
下载Jquery插件：jQuery ellipsis plugin
调用方法：
1.$(document).ready(function() {
2. $('.ellipsis').ellipsis();
3.}2015-08-06

一般用程序调用的时候设置字数限制，文字结束后，是显示省略号的2014-11-24

我也不复制粘贴了，链接个网址吧
网页链接
2017-12-10

用overflow:ellipsis；就可以2017-11-14

mengvlog 阅读 13 次 更新于 2025-06-21 01:52:34 我来答关注问题 0

6 个回答檬味博客专题活动

div内文字显示两行,超出两行部分省略号显示css能实现么?
只能在第一行内显示省略，不能在第二行内换行测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试 ...
div内文字显示两行,超出两行部分省略号显示css能实现么?
display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;
css里面怎么让文字长的时候两行显示,最多两行,多余的省略号显示,最重要的是支持ie浏览器,
1、首先，打开html编辑器，新建html文件，例如：index.html。2、在index.html中的标签中，输入css代码：div{ width: 100px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;} 3、浏览器运行index.html页面，此时文字超过2行会自...
div+css怎么显示两行或三行文字,然后多出的部分省略号代替??
如果想要在一行里实现“超出长度显示省略号”，是可以的。overflow: hidden;white-space: nowrap;text-overflow:ellipsis;这几句css就可以，不要加上去的容器一定要写了宽度的注意：这里实现的是“超出长度”，而不是“超出字数”，并且在一行里实现。如果是两行或者三行的容器，想要纯用css实现这个方法...
css问题。div文本溢出,用滚动条显示,使用overflow:scroll,显示滚动条,但是横向文本显示不全
你想要怎么显示呢？你这个分类名称的确太长，一行显示不全，只能分两行了。要不然你就写个长度截取的函数，让长出来的部分显示为省略号，鼠标放上去显示全称提示。

其他CSS类似问题

檬味博客在线解答立即免费咨询

div内文字显示两行，超出两行部分省略号显示css能实现么？

其他CSS类似问题

CSS相关话题