Question

我有<td width="25%">但是如果它填充了大于25％的东西，它会变大。如何使用css或html

阻止它超过25％

Answer 1

使用表格中的css table-layout:fixed

在此处找到：http://www.w3.org/TR/CSS21/tables.html#fixed-table-layout

Answer 2

您可以使用max-width: 25%;来防止超出最大宽度;虽然说这是一个css解决方案，而不是一个html属性，所以你必须使用：

<td style="max-width: 25%;">...</td>

或者，更好的是，在样式表中指定：

td {
    max-width: 25%;
}

正如@Asherer正确指出（在评论中），这不一定适用于所有浏览器。要强制执行max-width，可能值得将td的内容包含在div中（或者，如果它们是内联元素，则为span）并应用max-width到那个元素。

例如：

<td>
    <div>
        Cell contents
    </div>
</td>

td {
    width: 25%;
    max-width: 25%;
}

td div {
    width: 100%;
    overflow: hidden; /* or 'auto', or 'scroll' */
}

随着时间的推移，这可能会变得有点混乱，我通常不会添加不必要的标记，但在这种情况下，有助于跨浏览器兼容性。

Answer 3

您可以使用max-width样式属性，并将其设置为25％。

td{
   max-width:25%;
}

Answer 4

检查此SO线程。它可能有用How to limit a table cell to one line of text using CSS?

以下是一些可以帮助您的CSS：

td {
    white-space: nowrap;
    overflow: hidden;
    width: 25%;
    height: 25px;
    border: 1px solid black;
}

table{
    table-layout:fixed; 
    width: 200px;
}

HTML / CSS - 如何使我的表列永远不会更宽，我指定为宽度

4 个答案: