css让img图⽚在div标签垂直居中使⽤ flex 布局
<div class="login">
<img class="login-img"src="images/logo.png"/>
<span class="login-wel">早上好，欢迎登录 ~</span>
</div>
.login-top{
display: flex;
align-items: center;
.login-img{
width: 34px;
height: 40px;
}
.login-wel{
font-size: 28px;
margin-left: 8px;
color: #ffffff;
font-weight: 400;
}
}
操作 display: table 完成img图⽚垂直居中
<div class="tablebox">
<div id="imgbox">
<img src="1.jpg"alt="">
</div>
</div>
.tablebox{width: 300px;height: 250px;background: #fff;display: table}
#imgbox{display: table-cell;vertical-align: middle;}
#imgbox img{width: 100px}
⽤绝对定位完成垂直居中
<div class="posdiv">
<img src="1.jpg"alt="">
</div>
.posdiv{width: 300px;height: 250px;background: #fff;position: relative;margin:0 auto}
div中的div居中
.
posdiv img{width: 100px;position: absolute;top: 50%;margin-top: -50px;} // transform:translateY(-50%);

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。