2

我有这个 ：

<table>
    <tr>
        <td> 
            <br/>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
            <br/>tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
            <br/>quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
            <br/>consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
            <br/>cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat 
            <br/>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </td>
    </tr>
</table>

如何设置行高？我希望垂直截断多余的行。我已经尝试过：

td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

它可以在水平方向上正常工作，但在垂直方向上却不行。你有什么诀窍吗？有时 css 感觉就像在做巫术。

4

1 回答 1

0

我相信表格单元格和行会增长到它们内部内容的高度。我认为如果不将内容包装在 div 中，然后应用样式来限制该 div 的大小，这是不可能的......

此外，似乎换行符（
）弄乱了自动换行......

这是一个示例：jsFiddle 在 td 中显示文本溢出

这是我使用的代码：（html）

<table>
<tr>
    <td>
        <div class="container-td">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
    </td>
</tr>

(CSS)

.container-td {
height: 100px;
line-height: 100px;
width: 200px;
overflow: hidden;
border: 1px solid #ccc;
white-space: nowrap;
text-overflow: ellipsis;}
于 2013-04-26T15:42:49.873 回答