如何在 html 中将图像与文本放在同一行 [关闭]

【问题标题】：How can I have an image on the same line as text in html [closed]如何在 html 中将图像与文本放在同一行 [关闭]
【发布时间】：2018-06-29 00:02:59
【问题描述】：

我是 HTML，我想做一个专业的标题。我的问题是，当我将徽标放入 div 中，然后将一些链接也放入该 div 中时，它会将它们分成不同的行。有没有办法解决这个问题？

【问题讨论】：

标签： html

【解决方案1】：

你可以做一张桌子，把它们放进去：

<table>
<tr>
  <th>
    <img src="https://smallbusinessbc.ca/wp-content/themes/sbbcmain/images/circle-icons/icon-education.svg" width="50px" height="50px">
  </th>
  <th>
    Write your stuff!
  </th>
</tr>
</table>

您可以使用任何图像和任何文字

【讨论】：

@rahul-ahuja 很高兴听到

【解决方案2】：

如下图使用display:flex：

.nav{
  border:1px solid black;
  display:flex;
}
.links{
  margin-left:auto;
}

<div class="nav">
  <div class="logo">LOGO</div>
  <div class="links">About Us | Contact Us</div>
</div>

【讨论】：

如果“LOGO”是图像，这是否有效？