使用Line-Height将CSS居中

Question

我不明白为什么在段落和div元素之间有一个间隙，下面是我的代码。我是CSS的新手。

​

.center {
      line-height: 200px;
      height: 200px;
      border: 3px solid green;
      text-align: center;
     }
.center p {
display: inline-block;
vertical-align: middle;
background-color: green;
}

 <div class="center">
    <p>I am vertically and horizontally centered.
    </p>
 </div>

​

Answer 1

您的段落具有页边距-浏览器默认设置为上边距。将其设置为margin top:0，则不会出现间隙。