我可以完全隐藏一半截断的文本行吗？

如果我将一段文本放入一个具有设定高度和隐藏溢出的容器中，我通常最终会得到可以切断的最后一行。 Example jsFiddle或图像：我可以完全隐藏一半截断的文本行吗？

enter image description here

有没有办法有该行不会出现完全，而不是有这种情况发生？

的情况是，我有列这是一个动态的高度包含博客，帖子的文字（父身高，这是身体高度的80％，100％），我想显示“读取所有”底部是否有溢出的文字（易于确定）。目前它看起来很糟糕，只有半个渲染文本坐在它上面。

我无法删除溢出，因为列需要在导航之前结束，它位于页面的底部。

2012-08-29 Marty

您可以从属性text-overflow激励你，但你必须用JavaScript来做到这一点的倍数行：http://pvdspek.github.com/jquery.autoellipsis/（通过With CSS, use "..." for overflowed block of multi-lines）

来源

2012-08-29 10:14:28 LeBen

有没有解决方案不包含jquery？ – Onza

您可以根据自己的舒适度增加或减少line-height

来源

2012-08-29 10:02:29 supersaiyan

我将如何动态设置适当的'行高'？而且，当屏幕上有5列不同线高时，从一致性角度看，这可能不会太大。 – Marty

我没有越来越..为什么你给不同的线路高度？所有5列应该具有相同的行高 – supersaiyan

啊，尽管如此，我仍然需要确定在动态空间中行高应该是多少的问题。 – Marty

删除overflow:hidden

div 
{ 
    width: 100px; 
    height: 92px; 
    background: black; 
    color: white; 
}

来源

2012-08-29 10:06:07 Carlos

看到编辑，不幸的是这不会在我的情况。 – Marty

看到这低于

<li style="color: Black; font-weight: bold; oveflow:hidden; line-height: 1.2em;height: 2.6em; ">Page Size 
        <select id="ddlOrderstoDisplay" style="width: 50px;"> 
         <option value="25">25</option> 
         <option value="50">50</option> 
         <option value="75">75</option> 
         <option value="100">100</option> 
         <option value="150">150</option> 
        </select>    
       </li>

我把这些线，在标签内，将工作在所有的浏览器。希望这会帮助你

**overflow: hidden; 
line-height: 1.2em; 
height: 3.6em;**

来源

2013-08-20 05:56:47 Praveen04

只需添加“列宽”属性我的代码，它会工作。在你的例子中它将列宽：100px

来源

2016-05-25 10:44:20

我可以完全隐藏一半截断的文本行吗？

回答

相关问题