在我的表格中,我设置列中第一个单元格的宽度为100px。 但是,当此列中的某个单元格中的文本太长时,列的宽度就会超过100px。如何禁用此扩展?
当前回答
看到的: http://www.html5-tutorials.org/tables/changing-column-width/
在table标记之后,使用col元素。不需要结束标记。
例如,如果你有三列:
<table>
<colgroup>
<col style="width:40%">
<col style="width:30%">
<col style="width:30%">
</colgroup>
<tbody>
...
</tbody>
</table>
其他回答
这也有助于,在最后一个“填充单元格”,宽度:auto。这将占用剩余空间,并保留指定的所有其他维度。
设置:
style="min-width:100px;"
为我工作。
如果不想要固定的布局,请指定一个类,使列的大小适当。
CSS:
.special_column { width: 120px; }
HTML:
<td class="special_column">...</td>
使接受的答案响应小屏幕时,小于固定宽度。
HTML:
<table>
<tr>
<th>header 1</th>
<th>header 234567895678657</th>
</tr>
<tr>
<td>data asdfasdfasdfasdfasdf</td>
<td>data 2</td>
</tr>
</table>
CSS
table{
border: 1px solid black;
table-layout: fixed;
max-width: 600px;
width: 100%;
}
th, td {
border: 1px solid black;
overflow: hidden;
max-width: 300px;
width: 100%;
}
JS小提琴
https://jsfiddle.net/w9s3ebzt/
您需要在相应的CSS中编写这些内容
table-layout:fixed;