文本和输入框之间的 CSS 距离

当我们在网页中使用文本和输入框时，有时候需要为它们之间添加一些间距，以提高美观性和可读性。这篇文章将介绍如何使用 CSS 为文本和输入框之间添加间距。

使用 padding 属性添加间距

CSS 中的 padding 属性可以用来为元素的内部添加一定的空白区域，从而达到添加间距的效果。我们可以为文本和输入框分别设置 padding，使它们之间产生一定的距离。

input {
  padding: 10px;
}

label {
  padding-right: 10px;
}

在这个例子中，我们为输入框添加了 10px 的 padding，为文本添加了 10px 的 padding-right。

使用 margin 属性添加间距

除了使用 padding 属性，我们还可以使用 margin 属性为文本和输入框之间添加间距。margin 属性可以为元素的外部添加空白区域，从而使元素与其它元素之间产生一定的距离。

input {
  margin-bottom: 10px;
}

label {
  margin-right: 10px;
}

在这个例子中，我们为输入框添加了 10px 的 margin-bottom，为文本添加了 10px 的 margin-right。

结论

无论是使用 padding 还是 margin 属性，都可以为文本和输入框之间添加间距。我们可以根据具体的需求选择适合的属性，达到更好的设计效果。