Question

我有一个表数据可能会不时变化。它是填充用户注释。注释将存储在数据库中并显示在html表中以供参考。用户注释可能会在某些时候执行太多，在这种情况下，我的html表的高度和宽度也会增加以显示所有数据。但我想给表中标签的固定高度和宽度，并只显示将从数据库中取出的一半用户评论..

例如

<table>
<th>id</th>
<th>Comments</th>
<th>User details</th>
<tr>
<td>1</td>

<td>Lorem ipsum dolor sit amet consectetuer adipiscing elit Suspendisse eget est ac enim posuere adipiscing Nunc sollicitudin elit sed facilisis fringilla lectus mauris eleifend tortor eu auctor nulla odio in odio Cras sed orci Vestibulum ante ipsum primis in faucibus</td>


<td>John smith</td>
</tr>
</table>

在上表中，注释列将因其已执行的文本而得到扩展。我希望它只显示一行或两行

我怎样才能用css做到这一点？

Answer 1

您应该添加包装器来执行此操作：

<td>
    <div class="cont">Lorem ipsum dolor sit amet consectetuer adipiscing elit 
        Suspendisse eget est ac enim posuere adipiscing Nunc sollicitudin elit 
        sed facilisis fringilla lectus mauris eleifend tortor eu auctor nulla 
        odio in odio Cras sed orci Vestibulum ante ipsum primis in faucibus
   </div>
</td>

和CSS：

.cont {
    overflow: hidden;
    width: 300px;  /* or other */
    -o-text-overflow: ellipsis;  /* Opera */
       text-overflow: ellipsis;
    white-space: nowrap;
}

Answer 2

使用CSS，将overflow: hidden分配给内容，以及max-width和max-height。这应该可以解决问题。

Answer 3

写

<td style="width: 300px;">Lorem ipsum dolor sit amet consectetuer adipiscing elit Suspendisse eget est ac enim posuere adipiscing Nunc sollicitudin elit sed facilisis fringilla lectus mauris eleifend tortor eu auctor nulla odio in odio Cras sed orci Vestibulum ante ipsum primis in faucibus</td>

300px可以是您的选择..

Answer 4

更好的替代方法可能是在将注释加载到服务器端的页面之前截断注释。然后你可以附加一个省略号来表明它被截断了一个指向完整评论的链接 - 这比简单地隐藏一些文本更加用户友好。

如何将表table（）中的内容限制到某个限制？

4 个答案: