設置多個背景圖片時，單獨設置每個圖片的位置和大小

首先

使用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%;
}

　　

最終的顯示效果如下：

 

即使瀏覽器窗口縮小也是沒關系的：