div中使用背景图片

在div中使用背景图片,并可以随意缩放图片

//html
<div class="icon"></div>

//css
.icon
     display: inline-block
     vertical-align: top
     margin-top: 6px
     width: 30px
     height: 32px
     margin-right: 9px
     bg-image('logo')
     background-size: 30px 32px

这里获取背景图片的方法使用的是stylus中函数调取,重要的是设置background-size属性,分别是宽高,然后再设置div的宽高,就能正确显示图片啦,如果把div的宽度拉长,还可以看到重复出现的情况,可以设置background-repeat决定是否重复

你可能感兴趣的:(前端学习)