如何删除表行之间的空白区域

Question

我实际上正在为一些非常容易上学的东西工作，但我没有做一些简单的事情。我试图得到这个结果，但我在表行之间有一个空格。如果这个问题得到解决，我会很高兴的。如果你应该有时间，请你告诉我为什么 td > h3,p{ padding-left: .5rem;padding-bottom: 1rem;}仅适用于中间的td？

但我得到了这个结果：

我的代码是这样的：

table{
  border: 1px solid black;
}

th{
  background-color: #F7BF2A;
  padding: .5rem;
  color: white;
}

td{
  border: 1px solid black;
}


td > h3,p{
  padding-left: .5rem;
  padding-bottom: 1rem;
}

<table>
        <tr>
          <th>Wanneer</th>
          <th>Wat</th>
          <th>Waar</th>
        </tr>
        <tr>
          <td class="mid">14u00</td>
          <td>
            <h3>Zeepkistenrace</h3>
            <p>Knutsel jouw zeepkist in elkaar en breng ze mee naar de top van de kemmelberg. Inschrijven kan via <a href="mailto:zeepkisten@burgerfeesten.be?subject=zeepkist">e-mail naar zeepkisten@burgerfeesten.be</a></p>
          </td>
          <td>Kemmelberg</td>
        </tr>
        <tr>
          <td class="mid">19u00</td>
          <td>
            <h3>Eetwedstrijd</h3>
            <p>Wie eet het meeste burgers in 30 minuten? Versla jij het record van 16 burgers? Inschrijven kan de dag zelf aan de bonnentjesstand.</p>
          </td>
          <td colspan="2">Feesttent marktplein</td>
        </tr>
        <tr>
          <td class="mid">20u00</td>
          <td><h3>Mister/Miss KemmelBurger</h3></td>
        </tr>
        <tr>
          <td class="mid">21u00</td>
          <td>
            <h3>Balkan Bonanza</h3>
            <p>Wie de beentjes al eens wil losgooien kan dit perfect doen op de tonen van Balkan Bonanza. Deze groep uit Loker brengt een verrassende mix van balkan en bluegrass. Benieuwd? Afkomen!</p>
          </td>
          <td>Podium</td>
        </tr>
        <tr>
          <td class="mid">22u00</td>
          <td>
            <h3>Bal van de Burger</h3>

            <p>We feesten door tot in de vroege uurtjes met dicobar Bun &amp; Pickles.</p>
            <span>VVK: € 3 - ADD: € 5</span>
          </td>


          <td>Podium en feesttent</td>
        </tr>

      </table>

Answer 1

您应该添加border-collapse: collapse标记以确保合并边框：

＆＃13;

＆＃13;

table{
  border: 1px solid black;
  border-collapse: collapse;
}

th{
  background-color: #F7BF2A;
  padding: .5rem;
  color: white;
}

td{
  border: 1px solid black;
}


td > h3,p{
  padding-left: .5rem;
  padding-bottom: 1rem;
}

＆＃13;

<table>
        <tr>
          <th>Wanneer</th>
          <th>Wat</th>
          <th>Waar</th>
        </tr>
        <tr>
          <td class="mid">14u00</td>
          <td>
            <h3>Zeepkistenrace</h3>
            <p>Knutsel jouw zeepkist in elkaar en breng ze mee naar de top van de kemmelberg. Inschrijven kan via <a href="mailto:zeepkisten@burgerfeesten.be?subject=zeepkist">e-mail naar zeepkisten@burgerfeesten.be</a></p>
          </td>
          <td>Kemmelberg</td>
        </tr>
        <tr>
          <td class="mid">19u00</td>
          <td>
            <h3>Eetwedstrijd</h3>
            <p>Wie eet het meeste burgers in 30 minuten? Versla jij het record van 16 burgers? Inschrijven kan de dag zelf aan de bonnentjesstand.</p>
          </td>
          <td colspan="2">Feesttent marktplein</td>
        </tr>
        <tr>
          <td class="mid">20u00</td>
          <td><h3>Mister/Miss KemmelBurger</h3></td>
        </tr>
        <tr>
          <td class="mid">21u00</td>
          <td>
            <h3>Balkan Bonanza</h3>
            <p>Wie de beentjes al eens wil losgooien kan dit perfect doen op de tonen van Balkan Bonanza. Deze groep uit Loker brengt een verrassende mix van balkan en bluegrass. Benieuwd? Afkomen!</p>
          </td>
          <td>Podium</td>
        </tr>
        <tr>
          <td class="mid">22u00</td>
          <td>
            <h3>Bal van de Burger</h3>

            <p>We feesten door tot in de vroege uurtjes met dicobar Bun &amp; Pickles.</p>
            <span>VVK: € 3 - ADD: € 5</span>
          </td>


          <td>Podium en feesttent</td>
        </tr>

      </table>

＆＃13;

＆＃13;

＆＃13;

Answer 2

将border-collapse: collapse;添加到table。

table {
    border: 1px solid black;
    border-collapse: collapse;
}

＆＃13;

＆＃13;

table {
    border: 1px solid black;
    border-collapse: collapse;
}

th{
  background-color: #F7BF2A;
  padding: .5rem;
  color: white;
}

td{
  border: 1px solid black;
}


td > h3,p{
  padding-left: .5rem;
  padding-bottom: 1rem;
}

＆＃13;

<table>
        <tr>
          <th>Wanneer</th>
          <th>Wat</th>
          <th>Waar</th>
        </tr>
        <tr>
          <td class="mid">14u00</td>
          <td>
            <h3>Zeepkistenrace</h3>
            <p>Knutsel jouw zeepkist in elkaar en breng ze mee naar de top van de kemmelberg. Inschrijven kan via <a href="mailto:zeepkisten@burgerfeesten.be?subject=zeepkist">e-mail naar zeepkisten@burgerfeesten.be</a></p>
          </td>
          <td>Kemmelberg</td>
        </tr>
        <tr>
          <td class="mid">19u00</td>
          <td>
            <h3>Eetwedstrijd</h3>
            <p>Wie eet het meeste burgers in 30 minuten? Versla jij het record van 16 burgers? Inschrijven kan de dag zelf aan de bonnentjesstand.</p>
          </td>
          <td colspan="2">Feesttent marktplein</td>
        </tr>
        <tr>
          <td class="mid">20u00</td>
          <td><h3>Mister/Miss KemmelBurger</h3></td>
        </tr>
        <tr>
          <td class="mid">21u00</td>
          <td>
            <h3>Balkan Bonanza</h3>
            <p>Wie de beentjes al eens wil losgooien kan dit perfect doen op de tonen van Balkan Bonanza. Deze groep uit Loker brengt een verrassende mix van balkan en bluegrass. Benieuwd? Afkomen!</p>
          </td>
          <td>Podium</td>
        </tr>
        <tr>
          <td class="mid">22u00</td>
          <td>
            <h3>Bal van de Burger</h3>

            <p>We feesten door tot in de vroege uurtjes met dicobar Bun &amp; Pickles.</p>
            <span>VVK: € 3 - ADD: € 5</span>
          </td>


          <td>Podium en feesttent</td>
        </tr>

      </table>

＆＃13;

＆＃13;

＆＃13;