13

如果我将一段文本放入一个具有设定高度和隐藏溢出的容器中，我通常会以可能适合的最后一行被截断而告终。示例 jsFiddle或图像：

在此处输入图像描述

有没有办法让这条线不完全出现而不是发生这种情况？

场景是我的列是动态高度（父高度的 100%，即正文高度的 80%），其中包含博客文章文本，如果有，我想在底部显示“全部阅读”溢出的文本（易于确定）。目前它看起来很糟糕，上面有一半渲染的文本。

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

4

5 回答 5

1

您可以从属性中激发您的灵感，text-overflow但您必须使用 JavaScript 来处理多行： http: //pvdspek.github.com/jquery.autoellipsis/（通过使用 CSS，使用“...”表示溢出的多行块行）

于 2012-08-29T10:14:28.737 回答
1

看到这是我下面的代码

 <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-20T05:56:47.360 回答
0

您可以增加或减少line-height

根据您的舒适度

于 2012-08-29T10:02:29.297 回答
0

消除overflow:hidden

div
{
    width: 100px;
    height: 92px;
    background: black;
    color: white;
}​
于 2012-08-29T10:06:07.207 回答
0

只需添加'column-width'属性，它就会起作用。在您的示例中，它将 column-width:100px

于 2016-05-25T10:44:20.770 回答