【问题标题】：How to fix the cell widh in CSS or xls如何修复 CSS 或 xls 中的单元格宽度
【发布时间】：2014-10-26 16:25:18
【问题描述】：

我创建了一个包含 3 列的表格。但是当我重新调整浏览器的大小时，所有的列都会根据浏览器的大小变小。

我想固定第一列的宽度，这样就不会调整大小。任何人都可以帮助解决这个问题。

<tr>
<th width="1%" style="background-color: #88A4BB"></th>
<th width="7%" style="background-color: #88A4BB"></th>
<th width="92%" style="border:none;font-size:12px" colspan="17"></th>

</tr>

谢谢

【问题讨论】：

尝试以像素为单位设置min-width属性（例如min-width:100px;）
您的“宽度”属性以百分比表示。要么使用绝对度量（例如 width="75px"），要么使用 min-width。但请注意 min-width 不适用于旧版本的 IE
HTML Table - Both fixed and multiple variable column widths的可能重复

标签： css

【解决方案1】：

对于固定宽度，您需要使用像素，而不是百分比。

将width="1%" 替换为width="10" 以使th 具有10 像素（即）的固定宽度。

<tr>
    <th width="10" style="background-color: #88A4BB"></th>
    <th width="7%" style="background-color: #88A4BB"></th>
    <th width="92%" style="border:none;font-size:12px" colspan="17"></th>
</tr>

编辑

如果您不想在 th 中换行，请使用 CSS 属性 white-space 并将其放在 nowrap 上。

<tr>
    <th width="10" style="background-color: #88A4BB; white-space: nowrap;"></th>
    <th width="7%" style="background-color: #88A4BB"></th>
    <th width="92%" style="border:none;font-size:12px" colspan="17"></th>
</tr>

看起来您使用的是 HTML4，所以也许您也可以使用 nowrap 属性。看你的喜好了

<tr>
    <th width="10" nowrap="nowrap" style="background-color: #88A4BB"></th>
    <th width="7%" style="background-color: #88A4BB"></th>
    <th width="92%" style="border:none;font-size:12px" colspan="17"></th>
</tr>

【讨论】：

问题询问如何仅在其余列随窗口调整大小时固定第一列的宽度。
@Chris P 再次阅读我的答案。它完全按照要求进行。不使用百分比将使其固定。当保留其他ths 百分比时，它们将调整大小。不理解反对票。

【解决方案2】：

更新您的代码，如下所示。

 <table width="100%">
  <tr>
   <th width="100" style="background-color: #88A4BB;">sfd sfs</th>
   <th width="50%" style="background-color: #88A4BB">sfdsg gssh sfg</th>
   <th width="*" style="border:none;font-size:12px">hjj dgf dg</th>
  </tr>
 </table>

DEMO

【讨论】：