默认 fill 会把图片拉伸变形；cover 保持比例并填满盒子（可能裁切两侧）；contain 保持比例完整显示（可能留白）；scale-down 智能在 contain 与原尺寸间选小者。可再用 object-position 控制裁切点的位置（默认居中）。
典型用法：固定 200×200 圆形头像（border-radius:50% + object-fit:cover），无论原图横竖都能完美填充；或卡片封面统一 16:9 比例而拒绝变形。
<style> .av { width: 90px; height: 90px; border-radius: 50%; border: 3px solid #4a9eff; object-fit: cover; margin: 6px; } </style> <p>同一张横图，三种填充：</p> <img class="av" style="object-fit:fill" src="https://picsum.photos/id/64/300/150"> <img class="av" style="object-fit:cover" src="https://picsum.photos/id/64/300/150"> <img class="av" style="object-fit:contain" src="https://picsum.photos/id/64/300/150">