Question

我正在尝试使用表格构建此新闻稿模板，我遇到了表格这种非常奇怪的行为。有点1px左右有tr边框。我在列中使用.png图像，我读到这可能会导致问题，但我无法修复它。

<body style="background-color: rgb(209,213,214)">
  <p>&nbsp;</p>

  <table align="center" cellpadding="1" cellspacing="1" style="background-color:rgb(255, 255, 255);width:650px;">
    <tbody>
      <tr style="background-color: rgb(209,213,214);">
        <td colspan="5" style="padding: 0px; vertical-align: bottom;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508217161.png" style="width: 650px; height: 66px;" /></td>
      </tr>
      <tr>
        <td style="width: 600px;">&nbsp; &nbsp; &nbsp;&nbsp;<img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216084.png" style="width: 170px; height: 80px;" /></td>
        <td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216108.png" style="width: 25px; height: 25px;" /></td>
        <td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216125.png" style="width: 25px; height: 25px;" /></td>
        <td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216140.png" style="width: 25px; height: 25px;" /></td>
        <td style="width: 50px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216152.png" style="width: 25px; height: 25px;" /></td>
      </tr>
      <tr>
        <td colspan="5" style="height: 30px; vertical-align: middle; width: 615px; text-align: center;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508218847.jpg" style="width: 601px; height: 15px;" /></td>
      </tr>
      <tr>
        <td colspan="5" style="vertical-align: top; background-color: rgb(209, 213, 214); padding: 0px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508217471.png" style="width: 650px; height: 75px;" /></td>
      </tr>
      <tr>
        <td colspan="5" style="height: 30px; vertical-align: top; padding-left: 10px;"><strong><span style="font-size:28px;"><span style="font-family:arial;">&nbsp;</span><span style="font-family:georgia;"> Cora Trade Center</span></span></strong></td>
      </tr>
      <tr>
        <td colspan="5" style="height: 30px; vertical-align: middle; padding-left: 20px; text-align: center;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508218869.jpg" style="width: 601px; height: 15px;" /></td>
      </tr>
      <tr 5="" style="background-color: rgb(209,213,214);&gt;
			&lt;td colspan=">
      </tr>
    </tbody>
  </table>

Answer 1

如果您谈论1px白线，请设置

border="0" cellspacing="0" cellpadding="0"表格0。

然后，

＆＃13;

<html>
<head>
	<title></title>
</head>
<body style="background-color: rgb(209,213,214)">
<p>&nbsp;</p>

<table align="center" border="0" cellspacing="0" cellpadding="0" style="background-color:rgb(255, 255, 255);width:650px;">
	<tbody>
		<tr style="background-color: rgb(209,213,214);">
			<td colspan="5" style="padding: 0px; vertical-align: bottom;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508217161.png" style="width: 650px; height: 66px;" /></td>
		</tr>
		<tr>
			<td style="width: 600px;">&nbsp; &nbsp; &nbsp;&nbsp;<img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216084.png" style="width: 170px; height: 80px;" /></td>
			<td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216108.png" style="width: 25px; height: 25px;" /></td>
			<td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216125.png" style="width: 25px; height: 25px;" /></td>
			<td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216140.png" style="width: 25px; height: 25px;" /></td>
			<td style="width: 50px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216152.png" style="width: 25px; height: 25px;" /></td>
		</tr>
		<tr>
			<td colspan="5" style="height: 30px; vertical-align: middle; width: 615px; text-align: center;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508218847.jpg" style="width: 601px; height: 15px;" /></td>
		</tr>
		<tr>
			<td colspan="5" style="vertical-align: top; background-color: rgb(209, 213, 214); padding: 0px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508217471.png" style="width: 650px; height: 75px;" /></td>
		</tr>
		<tr>
			<td colspan="5" style="height: 30px; vertical-align: top; padding-left: 10px;"><strong><span style="font-size:28px;"><span style="font-family:arial;">&nbsp;</span><span style="font-family:georgia;"> Cora Trade Center</span></span></strong></td>
		</tr>
		<tr>
			<td colspan="5" style="height: 30px; vertical-align: middle; padding-left: 20px; text-align: center;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508218869.jpg" style="width: 601px; height: 15px;" /></td>
		</tr>
		<tr 5="" style="background-color: rgb(209,213,214);&gt;
			&lt;td colspan=">
		</tr>
	</tbody>
</table>

＆＃13;

此外，如果您要删除图片之间的空格，请将img设置为block，如果您想要删除该空间。

＆＃13;

img {
  display: block;
}

＆＃13;

<html>

<head>
  <title></title>
</head>

<body style="background-color: rgb(209,213,214)">
  <p>&nbsp;</p>

  <table align="center" cellpadding="0" cellspacing="0" style="background-color:rgb(255, 255, 255);width:650px;">
    <tbody>
      <tr style="background-color: rgb(209,213,214);">
        <td colspan="5" style="padding: 0px; vertical-align: bottom;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508217161.png" style="width: 650px; height: 66px;" /></td>
      </tr>
      <tr>
        <td style="width: 600px;">&nbsp; &nbsp; &nbsp;&nbsp;<img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216084.png" style="width: 170px; height: 80px;" /></td>
        <td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216108.png" style="width: 25px; height: 25px;" /></td>
        <td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216125.png" style="width: 25px; height: 25px;" /></td>
        <td style="width: 30px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216140.png" style="width: 25px; height: 25px;" /></td>
        <td style="width: 50px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508216152.png" style="width: 25px; height: 25px;" /></td>
      </tr>
      <tr>
        <td colspan="5" style="height: 30px; vertical-align: middle; width: 615px; text-align: center;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508218847.jpg" style="width: 601px; height: 15px;" /></td>
      </tr>
      <tr>
        <td colspan="5" style="vertical-align: top; background-color: rgb(209, 213, 214); padding: 0px;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508217471.png" style="width: 650px; height: 75px;" /></td>
      </tr>
      <tr>
        <td colspan="5" style="height: 30px; vertical-align: top; padding-left: 10px;"><strong><span style="font-size:28px;"><span style="font-family:arial;">&nbsp;</span><span style="font-family:georgia;"> Cora Trade Center</span></span></strong></td>
      </tr>
      <tr>
        <td colspan="5" style="height: 30px; vertical-align: middle; padding-left: 20px; text-align: center;"><img alt="" src="https://sendy.antreprenordigital.ro/uploads/1508218869.jpg" style="width: 601px; height: 15px;" /></td>
      </tr>
      <tr 5="" style="background-color: rgb(209,213,214);&gt;
			&lt;td colspan=">
      </tr>
    </tbody>
  </table>

＆＃13;

Answer 2

您需要使用border-collapse: collapse;

应用默认的html表格

table{
    border-collapse: collapse;
}

Strage 1px白色边框在表中

2 个答案: