设置多个背景图片时，单独设置每个图片的位置和大小

首先

使用background-image:url("./images/logo.jpg")  来指定背景图片的路径

使用background-repeat:repeat | repeat-x | repeat-y | no-repeat 来指定背景图片的重复次数

使用background-size:14px | 14% 指定背景图片大小

使用background-position：left top  |  x% y%  |  10px 20px 用来指定背景图片的位置

 

其实设置多个图片背景属性的做法 和  设置多个背景图片的做法是一样的，都是使用逗号分隔。

比如下面的代码：

#log{
	width:100%; 
	height:100%;
	background-image:url("logo_1.png"),url("logo_2.png"),url("logo_3.jpg"); 
	background-position: 10%,40%,80%; 
	background-repeat: no-repeat; 
	background-size:25%,25%,10%;
}

　　

最终的显示效果如下：

 

即使浏览器窗口缩小也是没关系的：