html - 如何在 div 中水平对齐 Logo 和 h1

Question

我想在 div 的左端对齐一个 Logo ，并在该 div 的中心对齐一个文本(文本应该看起来像在屏幕中心)。 div 的宽度适合屏幕。 Logo 和文本应在同一行。它是如何成为可能的？我已经像下面这样开始了。但是逐行显示了两个元素。

<div >
<img id="imglogo" alt="" src="images/ logo.JPG"  style="width: 300px;height:75px"  />
<h1 align="center" id="H1">Project Name</h1>
</div>

Answer 1

就个人而言，我更喜欢 table ，因为它可以很好地放置东西并且可靠。见下文:

<table border=1 style="table-layout: fixed; width:100%">
  <tr>
    <td><img id="imglogo" alt="" src="https://placehold.it/100x35" /></td>
    <td style="text-align: center">Centered Text</td>
    <td></td>
  </tr>
</table>

当然，您可以根据需要进行自定义。