CSS中并排垂直对齐的图像和文本 [英] vertical middle aligned image and text side-by-side in CSS
本文介绍了CSS中并排垂直对齐的图像和文本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正尝试使用两个 div
s连续打印图像和文本。
I'm trying to print an image and text consecutively with two div
s.
我已经获得了到目前为止的输出:
I have gained this output so far:
示例文本
但是我需要在图像后的中间而不是底部显示文本。
HTML
<body>
<div id="qr" style="display:inline-block; min-width:2.2cm; height:3.8cm; align: center;" >
[ image_url ]
</div>
<div style="display:inline-block; min-width:3.8cm;">
sample text
</div>
</body>
CSS
body{
width:21.1cm;
height:29.8cm;
background-color: white;
margin-top:0.4cm;
}
- 图像为
二维码
。所以我不能使用table
方法 -
div
在foreach
方法。因此无法更改尺寸。我怎样才能? - the image is
qr code
. so i can't usetable
method - the
div
using inforeach
method. so cant change the dimension. how can i?
推荐答案
您在追寻类似这样的东西吗?
Are you after something like this:
<div id="qr" style="display:inline-block; min-width:2.2cm; height:3.8cm; align: center;vertical-align: middle;" >
<img src="http://i.stack.imgur.com/25Rl3.jpg" style="height:3.8cm;">
</div>
<div style="display:inline-block;vertical-align: middle;">
sample text
</div>
这篇关于CSS中并排垂直对齐的图像和文本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文