Как заставить работать фоновую обложку в IE

Question

Я пробую все виды методов, которые говорят, что это сделает background-size: cover; работа в IE (версия, необходимая для IE8 +), которая… - Добавлены мета для IE = edge и chrome = 1 - Добавил все три "-мос-" в класс - Также попробуйте поместить все в один формат строки (но это не будет моим результатом, так как я создаю шаблон для другого, фоновая ссылка должна быть встроенной.

Что еще я пропустил?

.-bg-image-70 {
  min-height: 70vh;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

  -moz-background-size: cover;
  -o-background-size: cover;
  -ms-ie-background-size: cover;

}

  <div class="-bg-image-70" style="background-image: url(https://cdn.pixabay.com/photo/2015/04/19/08/33/flower-729512_960_720.jpg);" >

<div class="container"  ><h1>Hello!</h1></div>
        </div>
        
 

Answer 1

Из этой статьи мы можем видеть, что "background-size: cover;"поддержка IE 9+, поэтому ваш код не работает в браузере IE 8.Я предлагаю вам установить свойства ширины и высоты для контейнера div и фонового изображения.Например:

<style>
    .-bg-image-70 {
        background: url("http://3.bp.blogspot.com/_EqZzf-l7OCg/TNmdtcyGBZI/AAAAAAAAAD8/KD5Y23c24go/s1600/homer-simpson-1280x1024.jpg") no-repeat;
        width: 900px;
        height: 450px;
        border: 1px solid;
        background-size: 1300px 700px;
    }
</style>
<div class="-bg-image-70">
    <div class="container"><h1>Hello!</h1></div>
</div>

Кроме того, вы также можете обратиться к этой теме и этой статье , чтобы исправить эту проблему.