text和images同行显示
时间: 2024-02-21 11:58:13 浏览: 90
图片和文字居中显示
您可以使用CSS中的`display: inline-block`属性来让文本和图片在同一行显示,例如:
HTML代码:
```
<div class="content">
<p>这是一段文字,<img src="image.jpg" alt="图片">这是一张图片。</p>
</div>
```
CSS代码:
```
.content img {
display: inline-block;
vertical-align: middle;
margin-right: 10px;
}
```
这里,我们给`<img>`标签添加了一个`display: inline-block`的样式,让图片和文本在同一行显示。为了让图片和文本垂直居中,我们还添加了`vertical-align: middle`的样式。最后,我们使用`margin-right`属性来给图片添加一些右侧的间距,让排版看起来更加美观。
阅读全文