给div添加背景图片时查看图片样式-设置background-size属性

 

 

.img-box{
    display:flex;
    margin-top:10px;
    width :100%;
    height:450px;
    border:1px solid red;
    .divImg{
        width: 300px;
        height:300px;
        background: url(../assets/images/test.png) center center no-repeat;
        margin-right:10px;
        border:1px solid blue;
        &.shu{
            background: url(../assets/images/test2.png) center center no-repeat;
        }
        &.bz1{
            background-size: 100%;
        }
        &.bz2{
            background-size: 100% 100%;
            color:yellow;
        }
        &.cover{
            background-size: cover;
            color:yellow;
        }
        &.contain{
            background-size: contain;
        }
    }
    .imgIcon{
        width:500px;
        height:400px;
    }
    .imgIcon2{
        width:300px;
        height:500px;
    }
}

你可能感兴趣的:(javascript,前端,html)