效果图
需求:在固定的宽高下,最大程度并且完整的展示图片
css
文章来源:https://www.uudwc.com/A/edDYm/
.image-container {
margin: auto;
width: 1000px;
height: 1200px;
overflow: hidden;
background-color: pink;
}
.image-container img {
width: 100%;
height: 100%;
object-fit: contain;
}
html
文章来源地址https://www.uudwc.com/A/edDYm/
<div class="image-container">
<img src="/a.jpeg" alt="Your Image">
</div>