img与a标签行内对齐

Posted on In Word count in article: 88 Reading time ≈ 1 mins.
博客配置相关

未对齐

代码

1
2
3
4
<div>
<img style="width:20px;height:20px;display:inline-block;" src="https://icp.gov.moe/images/ico64.png">
<a href="https://icp.gov.moe/?keyword=20236696" target="_blank">萌ICP备20236696号</a>
</div>

效果

对齐后（添加vertical-align: middle）

代码

1
2
3
4
<div>
<img style="width:20px;height:20px;display:inline-block;vertical-align: middle;" src="https://icp.gov.moe/images/ico64.png">
<a href="https://icp.gov.moe/?keyword=20236696" style="vertical-align: middle;" target="_blank">萌ICP备20236696号</a>
</div>

效果