表单默认设置相同的垂直区域或如何调整我的表单？

Question

<form action="......@gmail.com" method="get">
    <label for="fname">First Name: </label>
    <input type="text" id="fname" name="fname"><br><br>
    <label for="surname">Surname:</label>
    <input type="surname" id="surname" name="surname"><br><br>
    <label for="email">E-mail:</label>
    <input type="text" id="email" name="email"><br><br>
    <input type="submit" value="Submit">
</form>

我想在类型框和姓氏、名字之间添加一些空格，但我也想显示相同的垂直线。 我让它的代码看起来很奇怪。 我怎样才能以不同的方式创建更专业的表格，你能给我一些基本的线索、建议或技巧吗？ 谢谢你的帮助。 （顺便说一句，我是 html 和 css 的初学者）

Answer 1

你可以使用：

<form action="......@gmail.com" method="get">
  <p><label for="fname">First Name: </label>
  <input type="text" id="fname" name="fname"></p>
  <p><label for="surname">Surname:</label>
  <input type="surname" id="surname" name="surname"></p>
  <p><label for="email">E-mail:</label>
  <input type="text" id="email" name="email"></p>
  <input type="submit" value="Submit">
</form>
<style>
  p { padding: 0; margin: 0; margin-bottom: 4px; }
</style>

根据您的喜好调整margin-bottom 。