连接多个html表时防止双边框 - 边框折叠不起作用

Question

请在加入多个html表时帮我防止双边框。我试图使用＆＃34; border-collapse：collapse＆＃34;但它不起作用。两张桌子之间的边界仍然是两倍。

＆＃13;

＆＃13;

<table style="border:1px solid black;border-collapse:collapse;width:100%">
    	<tr>
    		<td rowspan="3">Heading-1</td>
    		<td>Heading-2</td>
    		<td>Heading-3</td>
    	</tr>
    	<tr>
    		<td>Heading-4</td>
    		<td>Heading-5</td>
    	</tr>
    	<tr>
    		<td>Heading-6</td>
    		<td>Heading-7</td>
    	</tr>
    </table>
    <table style="border:1px solid black;border-collapse:collapse;width:100%">
    	<tr>
    		<td rowspan="3">Heading-1</td>
    		<td>Heading-2</td>
    		<td>Heading-3</td>
    	</tr>
    	<tr>
    		<td>Heading-4</td>
    		<td>Heading-5</td>
    	</tr>
    	<tr>
    		<td>Heading-6</td>
    		<td>Heading-7</td>
    	</tr>
    </table>
<table style="border:1px solid black;border-collapse:collapse;width:100%">
	<tr>
		<td rowspan="3">Heading-1</td>
		<td>Heading-2</td>
		<td>Heading-3</td>
	</tr>
	<tr>
		<td>Heading-4</td>
		<td>Heading-5</td>
	</tr>
	<tr>
		<td>Heading-6</td>
		<td>Heading-7</td>
	</tr>
</table>

＆＃13;

＆＃13;

＆＃13;

Answer 1

只需将margin-top: -1px;添加到table。

＆＃13;

＆＃13;

table {
  margin-top: -1px;
}

＆＃13;

<table style="border:1px solid black;border-collapse:collapse;width:100%">
  <tr>
    <td rowspan="3">Heading-1</td>
    <td>Heading-2</td>
    <td>Heading-3</td>
  </tr>
  <tr>
    <td>Heading-4</td>
    <td>Heading-5</td>
  </tr>
  <tr>
    <td>Heading-6</td>
    <td>Heading-7</td>
  </tr>
</table>
<table style="border:1px solid black;border-collapse:collapse;width:100%">
  <tr>
    <td rowspan="3">Heading-1</td>
    <td>Heading-2</td>
    <td>Heading-3</td>
  </tr>
  <tr>
    <td>Heading-4</td>
    <td>Heading-5</td>
  </tr>
  <tr>
    <td>Heading-6</td>
    <td>Heading-7</td>
  </tr>
</table>
<table style="border:1px solid black;border-collapse:collapse;width:100%">
  <tr>
    <td rowspan="3">Heading-1</td>
    <td>Heading-2</td>
    <td>Heading-3</td>
  </tr>
  <tr>
    <td>Heading-4</td>
    <td>Heading-5</td>
  </tr>
  <tr>
    <td>Heading-6</td>
    <td>Heading-7</td>
  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;