空格/空白之间 <table> 和 <h1> 的 <form> 元件

Question

<table>和<h1>之间有大量的空格，这两个空格都在表单元素中。 一旦删除<table>元素，该空格就会消失。 我正在使用<table>元素将元素与表单对齐。 有人可以解释为什么会这样吗？

 <form> <h2>Form Heading goes here</h2> <table> <tr> <td>First Name</td> <td><input type="text" name="f_name"></td> </tr> <tr> <td>Last Name</td> <td><input type="text" name="l_name"></td> </tr> </table> </form> 

Answer 1

默认情况下，h2标签在其下方添加边距。 以下CSS将删除该空间。

的CSS

h2 {
  margin-bottom: 0;
}

Answer 2

您必须删除<h2>标签的默认边距。

 h2{ margin: 0; } 

 <form> <h2>Form Heading goes here</h2> <table> <tr> <td>First Name</td> <td><input type="text" name="f_name"></td> </tr> <tr> <td>Last Name</td> <td><input type="text" name="l_name"></td> </tr> </table> </form>