所以我在彼此下面有两个html表每个表有两列我希望下表中的每一列都在上列的相似列之下的问题
|表一| |----|-----| |----|-----|
|表2| |----|-----| |----|-----|
编辑:
我试着用
<td valign="top"></td>
但是我认为这不是正确的代码
所以我在彼此下面有两个html表每个表有两列我希望下表中的每一列都在上列的相似列之下的问题
|表一| |----|-----| |----|-----|
|表2| |----|-----| |----|-----|
编辑:
我试着用
<td valign="top"></td>
但是我认为这不是正确的代码
试试这个,对两个表使用相同的 td 类。
<table id="table1">
<tr><td class="first">aaa</td><td class="second">aaa</td></tr>
<tr><td class="first">aaa</td><td class="second">aaa</td></tr>
<tr><td class="first">aaa</td><td class="second">aaa</td></tr>
</table>
<br /><br />
<table id="table2">
<tr><td class="first">aaa</td><td class="second">aaa</td></tr>
<tr><td class="first">aaa</td><td class="second">aaa</td></tr>
<tr><td class="first">aaa</td><td class="second">aaa</td></tr>
</table>
#table1, #table2 {float:left;width:700px;}
td.first{ width:40%;}
td.second{ width:60%;}
如果您向表格添加一个类,您应该能够删除边距和填充
table {
margin: 0;
padding: 0;
}
如果您需要它们精确排列,则指定每个字段的宽度
td {
width: 10%;
}
您可以为表格的列设置相同的宽度。
但是,您设置的宽度基本上只是建议,可能会因内容要求而被浏览器覆盖。在两个表上使用table-layout: fixed
CSS 通常可以解决这个问题,但它可能会产生令人讨厌的副作用(例如,不这样做的内容会被截断)。而且在任何情况下,您都必须对列宽进行一些猜测,而不是让浏览器动态计算它们。
最好的方法可能是将两张表合并为一张表。