背景图片填充div
Posted 艳阳天
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了背景图片填充div相关的知识,希望对你有一定的参考价值。
html: <div class=”contain-title”><div> css: (1)这种情况下图片可以填充整个div,但背景色和原背景图片不一致 background: url(../images/mall-bg.png) no-repeat center center fixed; height: 11.5rem; width: 100%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; display: flex; justify-content: space-around; align-items: center; (2)和背景图片基本一致,但背景图片在宽度上没有填充整个div,左右两边有间距 background: url(../images/mall-bg.png); background-size: 100%; height: 9rem; (3)背景图片在宽度上填充整个div,且基本与原背景图片效果一致 width: 100%; display: flex; justify-content: space-around; align-items: center; background: url(../images/mall-bg.png); height: 9rem; background-position: center; background-size: 110% 100%;
以上是关于背景图片填充div的主要内容,如果未能解决你的问题,请参考以下文章