html - 更改一列 css 的宽度

Question

这是我的表格的 css 属性。我想固定某列的宽度并 overflow hidden 。我尝试了所有列，但似乎无法正常工作。

.celltable2 table {
table-layout:fixed;
font-family: Helvetica, Arial, sans-serif;
width: 640px;
border-collapse:
collapse; border-spacing: 0;
}

table.celltable2 td, th {

border: 1px solid transparent;
width: 30px;
height: 30px;
transition: all 0.3s; 
overflow: hidden;
}

table.celltable2 td {

text-align:center; 
    vertical-align:middle;
}

有什么我可能遗漏的吗？。我尝试定义 colgroup 和 colspan 但没有成功。

Answer 1

问题出在你的CSS上

table.celltable2 td, th {
  border: 1px solid transparent;
  width: 30px;
  height: 30px;
  transition: all 0.3s; 
  overflow: hidden;
}

在此，您的目标宽度为 <td>但不是 <th>之后 ,你需要这样定义 table.celltable2 th而不仅仅是 th .

这是正确的

table.celltable2 td, table.celltable2 th {
  border: 1px solid transparent;
  width: 30px;
  height: 30px;
  transition: all 0.3s; 
  overflow: hidden;
}