Html 使 td 固定大小（宽度、高度），而其余的 td 可以扩展
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2085092/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Make a td fixed size (width,height) while rest of td's can expand
提问by Amra
Do you know, how to fix the size of a td Width and Height in a table allowing the rest of td on table to expand as needed?
您知道吗，如何固定表格中 td 宽度和高度的大小，以允许表格上的其余 td 根据需要扩展？
The problem is that when there is data inside of td's it will not shrink more than the data, but if is empty it will shrink all the way, if you expand the window the td will expand.
问题是当 td 里面有数据时，它不会比数据收缩得更多，但是如果为空，它会一直收缩，如果你扩大窗口，td 会扩大。
I would like to keep the size of the td whether you expand or shrink the window and whether the td has data inside or not.
无论您扩大还是缩小窗口，以及 td 内部是否有数据，我都想保持 td 的大小。
Also I need to keep the rest of td's able to expand as you expand window.
此外，我需要让 td 的其余部分能够在您扩展窗口时扩展。
Class tableContainerRow2 is the one I need it to be a fixed size. e.g.
类 tableContainerRow2 是我需要它是固定大小的类。例如
<style>
.divContainer {
margin:10px;
background-color:#C7D8EE;
border:2px solid #0076BF;
text-align:left;
}
.tableContainer {
color:#0076BF;
margin: -10px 0px -10px 0px;
border-spacing: 10px;
empty-cells:show;
width:90%;
}
.tableContainerRow2 {
background-color:white;
border:2px solid #0076BF;
}
</style>
<div class="divContainer">
<table class="tableContainer" cellspacing="10px">
<tr>
<td width="18%" style="white-space:nowrap;" >NHS Number</td>
<td width="17%"> </td>
<td width="10%" style="white-space:nowrap;">Date of Visit</td>
<td width="10%"> </td>
<td colspan="3" style="white-space:nowrap;">Care Time Started</td>
<td width="4%"> </td>
<td width="5%"> </td>
<td width="25%" rowspan="2" style="font-weight:bold;vertical-align:middle;white-space:nowrap;">Tick when<br/> care starts</td>
</tr>
<tr >
<td width="18%" class="tableContainerRow2"> 0123456789</td>
<td width="17%"> </td>
<td width="10%" class="tableContainerRow2"> 12/12/09</td>
<td width="10%"> </td>
<td width="5%" class="tableContainerRow2"> 12</td>
<td width="1%" > :</td>
<td width="5%" class="tableContainerRow2"> 10</td>
<td width="4%"> </td>
<td width="5%"> ☑</td>
<td width="10%" > </td>
</tr>
</table>
</div>
回答by spatel
just set the width of the td/column you want to be fixed and the rest will expand.
只需设置要固定的 td/列的宽度，其余部分将扩展。
<td width="200"></td>
回答by claw68
This will take care of the empty td:
这将处理空的 td：
<td style="min-width: 20px;"></td>
