haizlin / fe-interview

前端面试每日 3+1,以面试题来驱动学习,提倡每日学习与思考,每天进步一点!每天早上5点纯手工发布面试题(死磕自己,愉悦大家),6000+道前端面试题全面覆盖,HTML/CSS/JavaScript/Vue/React/Nodejs/TypeScript/ECMAScritpt/Webpack/Jquery/小程序/软技能……

Home Page:http://www.h-camel.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[css] 第133天 如何使用css3实现一个div设置多张背景图片?

haizhilin2013 opened this issue · comments

第133天 如何使用css3实现一个div设置多张背景图片?

background-image:url("1.jpg"),url("2.jpg"),url("3.jpg");
background-repeat: no-repeat, no-repeat, no-repeat;
background-position: 0 0, 200px 0, 400px 201px;

在 CSS3 中,只要在 background 中按顺序添加 url 就可以实现多张背景图片。每一个图片用 , 分开即可。
需要注意的就是浏览器的兼容问题。

示例地址:https://codepen.io/Konata9/pen/PoYBPLY