[分享]css中字体与上边框距离

在CSS中设置字体与上边框的距离可以更好地控制文字的位置和排版效果。通常使用的属性是line-height和margin-top。

p {
  font-size: 18px; /* 设置字体大小 */
  line-height: 1.5; /* 设置行高为1.5倍字体大小 */
  margin-top: 10px; /* 设置上边距为10px */
  border-top: 1px solid #000; /* 添加上边框 */
  padding-top: 10px; /* 设置上内边距为10px */
} 

在上面的代码中，我们先设置了字体大小为18px，然后使用line-height属性将行高设置为1.5倍字体大小，这样文字就能够保持良好的行距。接着使用margin-top属性设置了上边距为10px，使得文字与上边框之间保持一定的距离。

紧接着，我们为这个段落添加了一个上边框，并使用padding-top属性设置了上内边距为10px，这样文字与上边框之间的距离就变成了20px（上边距10px+上内边距10px）。

通过合理地使用line-height和margin-top属性，我们可以轻松控制文字与上边框的距离，从而获得更好的排版效果。