在我的表格中,我设置列中第一个单元格的宽度为100px。 但是,当此列中的某个单元格中的文本太长时,列的宽度就会超过100px。如何禁用此扩展?
当前回答
如果对表的访问受限,那么使用类或内联样式可能会比较复杂。
或者你也可以瞄准每一行的第一个td和第th个子元素(也就是第一列)
当我用width测试它时,下面的规则对我有用,但由于某种原因,max-width不适用:
thead, tbody tr {
display:table;
width:100%;
table-layout:fixed;
}
tr th:first-child, tr td:first-child {
width:100px;
}
其他回答
使接受的答案响应小屏幕时,小于固定宽度。
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;
我发现凯旋的答案使用vw而不是px更好,就像这样:
< td > < div =“宽度:10大众风格 " >...............</ div > < / td >
这是我调整列宽度所需要的唯一样式
设置:
style="min-width:100px;"
为我工作。
我用了这个
.app_downloads_table tr td:first-child {
width: 75%;
}
.app_downloads_table tr td:last-child {
text-align: center;
}