Chrome -webkit-object-fit 不起作用答案

【问题标题】：Chrome -webkit-object-fit doesn't workChrome -webkit-object-fit 不起作用
【发布时间】：2023-03-06 07:40:02
【问题描述】：

在 Chrome 的样式表中使用 -webkit-object-fit 会生成“未知属性名称”。

只是不支持吗？ -webkit-border-image 有效。

【问题讨论】：

【解决方案1】：

http://caniuse.com/object-fit

2016 年 2 月 15 日更新

除了 Internet Explorer 和 Edge 之外，所有主流浏览器现在都支持不带前缀的扩展（尽管在 Edge 中它是 flagged as Under Consideration 具有中等优先级，因此将来很可能会支持它）。

原始（过时）答案

这个特定的扩展似乎是一个 Opera 支持的项目，因为它尚未获得任何其他浏览器的支持。

【讨论】：

哦，很高兴知道。这是一个很好的图像调整工具。你对替代品有什么建议吗？谢谢。
我不久前发现了这篇关于Maintaining Aspect Ratio When Adjusting Height or Width 的博文……但我承认我从未尝试过使用它。
@SeanXiao：如果您仍在寻找适合对象的替代解决方案，请参阅此答案 - stackoverflow.com/a/21355203/140693

【解决方案2】：

目前没有活动的基于 webkit 的浏览器支持 object-fit 属性。这个属性已经存在了很长一段时间，并且该规范达到了候选推荐，因为它是在 Opera Presto (CSS Images Level 4 规范中

它已被添加到 Chrome 32 中，但由于它使用 Blink，该属性没有前缀，因此无需使用 -webkit- 前缀。

如果你正在寻找一个 polyfill，我已经制作了一个基于 jQuery 的，你可以在 http://www.steveworkman.com/html5-2/javascript/2012/css3-object-fit-polyfill/ 获得它

【讨论】：