刪除表格中的空白而不影響其他行的放置

-3

我對HTML和CSS相當陌生，我一直在努力通過使用表來創建可點擊的橫幅，但我無法擺脫之間的空白我的行和拼接的圖像。
這就是表看起來像在瀏覽器中刪除表格中的空白而不影響其他行的放置

Browser view of table

而下面是我的表碼：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="UTF-8" /> 
    <title>A Spot Banner</title> 
</head> 
<body> 
    <table style="width: 100%;"> 
     <tbody> 
      <tr> 
       <td colspan="3"><img src="images/top%20header%201.jpg" alt="TOP BANNER" /></td> 
      </tr> 
      <tr> 
       <td><img src="images/top%20row%20left%20side%201.jpg" alt="SECOND BANNER" /></td> 
       <td><a href="https://www.link.com/login"><img src="images/last%20image%20to%20line%20with%20top%20header%201.jpg" alt="THIRD BANNER" /></a></td> 
      </tr> 
      <tr> 
       <td><a href="https://www.link.com/application"><img src="images/bottom%20row%20left%20side%202.jpg" alt="FOURTH BANNER" /></a></td> 
      </tr> 
     </tbody> 
    </table> 
</body> 
</html>

我使用填充和利潤率試圖內嵌樣式，但都似乎會影響其他橫幅的位置，特別是第三個橫幅。
我很新，不太確定還有什麼其他的嘗試，有沒有人有任何建議或資源，我可以用它來解決這個問題？

來源

2017-10-17 Matthew Willis

請編輯您的問題並提供[mcve]。 **不要發佈代碼**的圖像。 – Xufox

嘗試加入這個CSS：

table { 
    border-collapse: collapse; 
} 
td { 
    padding: 0; 
}

邊界崩潰將做到這一點：刪除每個表中的數據（<td>）元素之間的空間。
填充也將刪除這些元素之間的任何剩餘空間。

來源

2017-10-17 22:31:54 rramos

刪除表格中的空白而不影響其他行的放置

回答

相關問題