css里文本换行问题
是这样的，有一段文字，我想让它只显示两行，多余的用省略号显示，可目前我写的只能显示一行，求大神帮帮忙！谢谢了！p{white-space:nowrap;text-over...
是这样的，有一段文字，我想让它只显示两行，多余的用省略号显示，可目前我写的只能显示一行，求大神帮帮忙！谢谢了！
p
{
white-space:nowrap;
text-overflow:ellipsis;
overflow:hidden;
font-size:12px;
} 展开
p
{
white-space:nowrap;
text-overflow:ellipsis;
overflow:hidden;
font-size:12px;
} 展开
展开全部
以前看到过这样一个逻辑。
大概意思是这样：给目标元素中，一个字一个字的往里添加，然后计算添加一个字后，元素的高度，然后记录（最初肯定是一行，当高度变化一次，就说明增加了一行，然后把行数就执行加1操作），然后就根据这个计算得到的行数，就可以判断，在什么时间，把字符串截断，显示为省略号了。。。
能理解这个逻辑不？那就试试用代码写出来吧。
好像是有点麻烦。。。。
<body>
<div id='view' style='width:200px;height:70px;overflow:auto'></div>
<script>
s = '条件：<br>\
div css javascript html<br>\
如何实现多行文本中最后一行文本最后自动显示省略号（如三行文本，文本自动换行后，第三行很长，自动显示省略号）';
el = document.getElementById('view');
n = el.offsetHeight;
for(i=10; i<s.length; i++) {
el.innerHTML = s.substr(0, i);
if(n <= el.scrollHeight) break;
}
el.style.overflow = 'hidden';
el.innerHTML = s.substr(0, i-3) + '...';
</script>
</body>
我给你一个建议吧，直接overflow:hidden，然后在最后，覆盖一张...的透明PNG的图片，不过最后显示的一个文字有可能被遮盖住，漏点出来
又或者你放弃多行加省略号的想法，这样什么事情都好解决了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
