css如何调整行间距

什么是CSS的行间距？

CSS的行间距是指文本行之间的距离，它是由两行基线(bottom)之间的距离来决定的。当我们在Web页面中设置段落、标题或文字时，会发现文本行之间有一些空白，这个空白就是行间距。

CSS如何调整行间距？

CSS提供了两种方式调整行间距：通过设置行高(line-height)属性或通过设置段落的下边距(margin-bottom)属性。

使用line-height属性调整行间距

可以使用CSS的line-height属性来设置文本行的高度，从而实现行间距的调整。

    p{
      line-height: 1.5; /*将line-height设置为1.5倍字体大小*/
    }
  

使用margin-bottom属性调整行间距

除了使用line-height属性，还可以使用CSS的margin-bottom属性来为段落设置下边距，从而实现行间距的调整。

    p{
      margin-bottom: 20px; /*设置20px下边距*/
    }
  

如何设置不同的行间距？

在HTML中，不同的标签会采用不同的字体大小和行高，因此可以通过为不同的标签设置不同的line-height或margin-bottom属性来实现不同的行间距。例如：

    h1{
      line-height: 1.2; /*设置h1的行间距*/
    }
    p{
      line-height: 1.5; /*设置p的行间距*/
    }
    .highlight{
      margin-bottom: 30px; /*设置.highlight类元素的行间距*/
    }