html – 使2个表具有相同的列大小

发布时间：2020-12-14 18:54:42 所属栏目：资源来源：网络整理

导读：我有两个直接在彼此之上的 HTML表.每个表具有相同数量的列,但它们包含的文本可能不同.并且每个表可以包含许多行.我希望这两个表具有完全相同的列宽,以便列始终排列.我不介意列中的文本是否包含在必要的范围内.由于其他原因,我不能将所有的行组合成单个表. 有

我有两个直接在彼此之上的 HTML表.每个表具有相同数量的列,但它们包含的文本可能不同.并且每个表可以包含许多行.我希望这两个表具有完全相同的列宽,以便列始终排列.我不介意列中的文本是否包含在必要的范围内.由于其他原因,我不能将所有的行组合成单个表.

有没有办法让这种情况发生？

请注意,此解决方案仅适用于Firefox和IE的最后2个版本.

解决方法

我建议在列上使用百分比宽度,确保这些宽度总是高达100％.

<style type="text/css">
  table { width: 100%; }
  td.colA { width: 30%; }
  td.colB { width: 70%; }
</style>

<table>
  <tr>
   <td class="colA">Lorem ipsum</td>
   <td class="colB">Lorem ipsum</td>
  </tr>
</table>

<table>
  <tr>
   <td class="colA">Lorem ipsum</td>
   <td class="colB">Lorem ipsum</td>
  </tr>
</table>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!