css 图片高度固定，宽度自适应，窗口缩小，图片两边隐藏，始终保持图片的内容居中

嗯，不知道这个标题说清楚了吗哈哈哈哈一般自适应，是等比例缩小的，但是我们这个不太一样，要求高度固定，但是图片不变形，

比如我们的结构是这样的

?

1 2 3

<div class="test">     <img src="./image/list_banner.png" alt=""> </div>

　样式这么些，用到这个属性，object-fit: cover;可以让图像按比例缩放至最大化，保证元素盒子被填满，而不会破坏图片的宽高比例。

?

1 2 3 4 5 6 7 8 9 10

.test{             margin: 0 auto;         img{             max-width: 100%;             height: 300px;             max-height: 300px;             font-size: 0;             object-fit: cover;         }     }

　　是不是贼简单，有些属性真的会用了少写好多东西