css3当背景图片大于或小于元素时,会呈现什么效果？

发布网友发布时间：2022-04-20 10:21

共3个回答

热心网友时间：2023-07-19 20:55

图片会覆盖颜色，但如果图片中存在透明色（GIF和PNG格式的图片支持透明，JPG则不支持），则背景颜色会透过图片的透明部分显示出来；或者如果背景图设置为不平铺（no-repeat）且图片比较小时，则未被图片覆盖的部分也会显示出背景颜色。

热心网友时间：2023-07-19 20:56

图片在上面，颜色在下面，就这样

热心网友时间：2023-07-19 20:56

当为一个元素同时设置背景颜色和背景图，且背景尺寸小于元素区域时，元素会被背景图覆盖，而背景图之外的部分使用背景颜色进行填充。

默认情况下，背景图会横纵向重复，铺满整个元素，为了防止这个问题，需要为背景设置“no-repeat”

如图：