旧版ie不支持object-fit，需用object-fit-images插件或背景图降级：插件通过data-object-fit属性模拟，要求父容器position: relative；背景图方案需改html结构，存在seo、alt丢失等问题。
旧版IE不支持object-fit，必须降级处理
IE 11 及更早版本完全不识别 object-fit 属性，设置后直接被忽略，图片会按默认拉伸或溢出容器。这不是兼容性警告，而是根本无效——你写的 object-fit: cover 在 IE10 里等于没写。
用 object-fit-images 插件补丁式修复
这个轻量库（仅约2KB）通过 JS 检测原生支持、对不支持的浏览器用 background-image + background-size 模拟行为，能保持 HTML 结构不变。
- 只在不支持的浏览器中运行：插件内部用
'objectFit' in document.documentElement.style判断，IE10/IE11 返回false - 自动绑定到所有带
data-object-fit的<img>标签，例如：<img src="a.jpg" data-object-fit="cover"> - 不修改原有 CSS，但要求图片父容器设为
position: relative，否则生成的伪元素定位错位 - 注意：插件不处理
<picture></picture>或srcset，响应式图片需额外监听load事件并手动调用objectFitImages()
手动用背景图替代，控制力更强但需改结构
当项目已大量使用 <img> 且无法加 data- 属性，或需兼容极端老版本（如 IE8），可统一用 div + 背景图方案：
- HTML 改为：
<div class="img-cover" style="background-image: url('a.jpg')"></div> - CSS 中用
background-size: cover+background-position: center模拟object-fit: cover - 必须显式设置宽高（或用 padding-top 百分比撑高），因为
div无内容时高度塌陷 - 缺点：图片无法被搜索引擎索引，
alt文本丢失，打印样式失效，且无法触发img原生的加载事件
IE 下 background-size: cover 的实际表现差异
IE9+ 支持 background-size，但存在两个隐藏坑：
- IE10 不支持
background-size: contain的单值写法（如background-size: 100%会被忽略），必须写成background-size: 100% 100%才生效 - IE11 对
background-position: center center解析不稳定，建议始终写全background-position: 50% 50% - 若容器宽高比与图片不一致，IE 的
cover裁剪位置可能和现代浏览器略有偏移，需实测视觉对齐
真正麻烦的不是怎么填满，而是填满之后哪部分被切掉——IE 没有标准可循，只能靠预览校正。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
