Question

我有2行，我试图让它们在表格中一起刷新。顶部单元格有一个图像，底部只是带有单元格背景的文本。

他们之间有一条线，我想摆脱那条线。

任何帮助将不胜感激。

js fiddle - https://jsfiddle.net/w3huqvbg/1/

<table class="mTest" border=0>
    <tr>
        <td><a href=""><img src="http://s8.postimg.org/5y5wc8jqp/test1.png" width="130"></a></td>
        <td><a href=""><img src="http://s8.postimg.org/5y5wc8jqp/test1.png" width="130"></a></td>
        <td><a href=""><img src="http://s8.postimg.org/5y5wc8jqp/test1.png" width="130"></a></td>
    </tr>
    <tr>
        <td class="mSelect"><a href="">text 1</a></td>
        <td><a href="">text 2</a></td>
        <td><a href="">text 3</a></td>
    </tr>
</table>

Answer 1

添加以下样式，应该可以解决这个问题：

tr, td{
  border: none;
  padding: 0;
}

Answer 2

将单元格上的填充设置为零：

td {
  padding:0;
}

＆＃13;

table.mTest {
  border-spacing: 100px 0px;
  text-align: center;
}
td {
  padding: 0;
}
td.mSelect {
  background-color: #59b1f6;
}
img[width="130"] {
  display: block;
}

＆＃13;

<table class="mTest" border=0>
  <tr>
    <td>
      <a href="">
        <img src="http://s8.postimg.org/5y5wc8jqp/test1.png" width="130">
      </a>
    </td>
    <td>
      <a href="">
        <img src="http://s8.postimg.org/5y5wc8jqp/test1.png" width="130">
      </a>
    </td>
    <td>
      <a href="">
        <img src="http://s8.postimg.org/5y5wc8jqp/test1.png" width="130">
      </a>
    </td>

  </tr>
  <tr>
    <td class="mSelect"><a href="">text 1</a>
    </td>
    <td><a href="">text 2</a>
    </td>
    <td><a href="">text 3</a>
    </td>


  </tr>
</table>

＆＃13;

Answer 3

同样td {padding:0}有效，您可能不想修改网站上的每个表格。正确的方法是cellpadding="0"：

<table class="mTest" border="0" cellpadding="0">

https://jsfiddle.net/w3huqvbg/5/

默认情况下table cellpadding为1。

css - 删除单元格中行之间的间距

3 个答案: