Question

我试图将背景图像跨越2个表行，但这似乎不起作用。

HTML：

<table id="branchTable">
 <thead>
  <th align="center">Tel.</th>
  <th align="center">Fax</th>
  <td rowspan="2" id="branch-logo"> d</td>
 </thead>
 <tbody>
  <td align="center">${_branch?.tel}</td>
  <td align="center">${_branch?.fax}</td>
 </tbody>
</table>

css：

#branch-logo {
    background-image: url(/public/images/logo.png);
    height:53px;
    width:100px;
    background-repeat: no-repeat;
    background-position: left;
}

图像似乎正在推动行向下而不是跨越。

更新

<table id="branchTable">
 <tr id="thead">
  <th align="center">Tel.</th>
  <th align="center">Fax</th>
  <td rowspan="2" id="branch-logo"> d</td>
 </tr>
 <tr id="tbody">
  <td align="center">${_branch?.tel}</td>
  <td align="center">${_branch?.fax}</td>
 </tr>
</table>

rowspan似乎在tbody和thead之间不起作用。使用tr可以解决问题。

Answer 1

你忘了你桌上的<tr>了。这可能是导致行为不端的原因。

正如斯科特所说，你在你的html中使用logo，在你的CSS中使用branch-logo。

编辑：此外，我不确定所有主流浏览器是否支持对thead和tbody上的单元格进行行扩展。这需要一些测试。

如何跨2个表行跨越图像？

1 个答案: