CSS设置背景图宽度100%,高度自适应

.newcenter{
        width: 100%;
        background: url('../../assets/img/newcenter.png') no-repeat;
        background-size: 100% auto;
    }
.newcenter:before{content: ""; display: block; padding-top: 100%;}

div的高度随背景图片的高度变化:
原理是通过padding-top或者padding-bottom实现,值是背景图片的宽高比。高度设置为0.

   .newcenter{
        width: 100%;
        background: url('../../assets/img/newcenter.png') no-repeat;
        background-size: 100% auto;
        padding-top: 13%;
        height: 0px;
    }

你可能感兴趣的:(CSS设置背景图宽度100%,高度自适应)