背景图片在ie8浏览器不能拉伸覆盖问题解决

1.html

<div class="top-content">
    <!--<img src="../../../resources/img/project/appro-anlyze-bg.png" alt="">-->
</div>

2.css

.top-content{
    height: 190px; 
    padding: 20px 20px 0 20px;
    margin-bottom: 20px;
    position: relative;
    background:url(../img/project/appro-anlyze-bg.png) no-repeat center 0;background-size: cover;
}

背景图片效果：

1.其他浏览器能全部覆盖

2.ie8以下background-size不兼容，背景图片不能显示完整

解决方法：改用img

<div class="top-content">
    <img src="../../../resources/img/project/appro-anlyze-bg.png" alt="">
</div>

css

.top-content{
    height: 190px;
    padding: 20px 20px 0 20px;
    margin-bottom: 20px;
    position: relative;
}

.top-content>img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
}

效果：

其他浏览器正常

ie8正常