html部分:
<div clas="box">
<img src = "xxx" />
</div>
css样式
.box {
width: 400px;
height: 400px;
display: flex;
justify-content: center;
align-items: center;
border: 1px solid #ddd;
overflow: hidden;
}
img {
width: auto;
height: auto;
//如果图片比例不为一比一 则可以适当增加比例以满足充满盒子
max-width: 100%;
max-height: 100%;
}