如何将div与文本垂直对齐

Question

我已经被这个问题困扰了一段时间。为了更好地解释我在这里问的问题，有一张图片：图片

希望这能有所帮助。这是我的代码：

.Home {
background-color: white;
padding: 35px 60px;
}

<p style="text-align: right; background-color: #e9e9e9;font-family:arial;font-size:20px;">upper message</p>
<div style="text-align:center;background-color:black;">
<img src="/Images/logo-text.png" width="250" hight="240" align="left"> <button class="Home">Home</button>
</div>

所以我要做的是让div与文本垂直对齐。提前感谢！

Answer 1

使用devtools进行故障排除。如果你关注你的<p>元素，你会发现它有20像素的边距。

.Home {
background-color: white;
padding: 35px 60px;
}
p {
margin: 0;
}

<p style="text-align: right; background-color: #e9e9e9;font-family:arial;font-size:20px;">upper message</p>
<div style="text-align:center;background-color:black;">
<img src="/Images/logo-text.png" width="250" hight="240" align="left"> <button class="Home">Home</button>
</div>