图片和文字垂直方向不居中
源代码
<div class="topbar-car">
<a href="#">
<img class="buy-car" src="./images/icon/购物车空.svg" alt="">
购物车(0)
</a>
</div>
.topbar-car{
float: right;
}
.topbar-car a{
display: inline-block;
height: 40px;
line-height: 40px;
}
.topbar-car a img{
height: 20px;
}
解决办法
在图片img的样式中加入代码vertical-align:middle;
即
.topbar-car a img{
vertical-align:middle;
height: 20px;
}
效果完成