ie8 背景图居中显示

2018-04-19  本文已影响34人  _信仰zmh

IE9+及其他浏览器实现背景图片平铺可能需要一个属性就可以background-size:100%/cover;

但是ie8下background-size是不兼容的,因此我们需要用到滤镜,来解决背景图片拉伸问题。

background-position: 图片展示得中心位置。

*主要是添加filter属性

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='路径',
sizingMethod='scale');
-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='路径',
sizingMethod='scale');
.header .banner {
    text-align:left;
    min-width:80%;
    margin:0 auto;
    height: 480px;
    background-position:50% 0%\9;
        background-size:cover\9;
    background-image:url("../img/banner.png");
    background-repeat: no-repeat;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
        src='../img/banner.png',
        sizingMethod='scale');
    -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='../img/banner.png',
    sizingMethod='scale');
}
上一篇下一篇

猜你喜欢

热点阅读