<分区>
<分区>
我有一个问题，我不想添加图像和垂直居中对齐图像。这看起来像这样 Link
我不想看起来像这样: Link
我的代码:
<style>
* {
margin: 0;
padding: 0;
border: none;
outline: none;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
.img {
width: 32px;
height: 32px;
border-radius: 50%;
}
p {
display: inline-block;
}
</style>
<img src="./image.jpg" class="img"> <p>Test</p>
我试过了，但是有没有更好的方法来解决这个问题？
p {
display: inline-block;
margin-bottom: -1.76em;
}
最佳答案
在您的 .img 类中添加一个 vertical-align:middle; 它应该可以解决问题。
* {
margin: 0;
padding: 0;
border: none;
outline: none;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
.img {
width: 32px;
height: 32px;
border-radius: 50%;
vertical-align:middle;
}
p {
display: inline-block;
}<img src="./image.jpg" class="img"> <p>Test</p>关于html - 带图像的垂直居中文本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48914903/