如何将文本和图像放在一起？

Question

我该怎么办？

我的HTML：

<div class="content">
   <img src="somesrc">
   <h3><strong>TITLE</strong></h3>
   <p>Description</p>
</div>

我想在标题和图像之间留出一些空间。

谢谢！

Answer 1

使用css Flex。在display: flex上添加.content。

.content {
  display: flex;
}

.content img {
  margin-right: 10px;
  display: block;
}

.content h3,
.content p {margin: 0;}

<div class="content">
  <img src="somesrc">
  <div class="text">
    <h3><strong>TITLE</strong></h3>
    <p>Description</p>
  </div>
</div>

Answer 2

在Html中

<div class="content">
       <img src="somesrc">
       <h3><strong>TITLE</strong></h3>
       <p>Description</p>
    </div>

CSS中的

.content, img{
  display:inline-block;
}