У меня есть изображение, которое я создал с рамкой CSS. Тем не менее, он не совместим с IE, есть ли хорошие альтернативы для IE?

Question

У меня есть изображение, которое я создал с рамкой CSS. Тем не менее, он не совместим с IE.

Есть ли хорошие альтернативы для IE?

#post-wrap {    
    margin:auto;
    padding: 0px 40px 70px 40px;
    width: 850px;
    border-width: 96px 17px 15px 36px;
    -moz-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
    -webkit-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
    -o-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;  
    border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
}

Answer 1

Свойство border-image css3 не реализовано в IE.

Единственная возможность - это обойти javascript (например, ie-css3.htc или другие скрипты).

Answer 2

Как вы уже узнали, IE не поддерживает CSS border-image.Если вы хотите, чтобы этот вид эффекта работал в IE, вам нужно использовать другой метод.

Очевидное решение - просто использовать изображение в качестве фонового изображения вместо границы.Это предполагает, что само изображение имеет правильный размер для элемента (т.е. IE не будет масштабировать фоновые изображения), и что элемент не изменит размер.Если это так, то это самая простая альтернатива.

Если это не так, то вы все равно можете сделать то же самое, но вам нужно загрузить изображение вконтекст переднего плана, чтобы IE мог масштабировать его, и поэтому вам нужно будет использовать некоторую дополнительную разметку в форме тега <img> и поместить его под существующим элементом.

Надеюсь, это поможет.