对象适合的替代选项:用于Internet Explorer的封面

Question

我正在寻找对象适合的另一种方法:覆盖Internet Explorer,因为它不支持它.基本上我使用的是物体贴合:盖子不会拉伸div内的图像.我在互联网上寻找一些解决方案,但我找到的所有解决方案都是从css加载图像而不是img标签,就像我正在做的那样.有没有人有任何替代方法不在Internet Explorer上的div内拉伸图像任何人都可以帮助我吗？

这是一个简单的代码

HTML

<div class="grid-image"> 
  <img itemprop="image" alt="TEST" src="images/15.jpg">
</div>

CSS

.grid-image {
    width: 100%;
    background-color: grey;
    position: relative;
    overflow: hidden;
    height: 100%;
}

grid-image img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

Answer 1

好的,我用这个解决了

HTML

<div class="grid-image" style="background-image: url(images/15.jpg);"></div>

CSS

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;