css3堆棧2身體背景圖像

我想使用2圖像作爲固定圖像的背景圖像，所以我使用身體上的代碼。css3堆棧2身體背景圖像

background: url(images/31.jpg) 100% no-repeat, url(images/12.jpg) 100% no-repeat; 
background-position: fixed;

我需要他們，以適應瀏覽器的寬度100％，我想圖像2疊加圖像1.後垂直我已閱讀有關使用與CSS3多個圖像相當多的網站。這可能沒有JavaScript，如果是的話，爲什麼我的圖像堆疊在一起，圖像1不是從左上角開始？

來源

2014-02-26 user2073133

以下參考CSS嘗試

#idName { 
    background-image: url(image1.png),url(image2.png); 
    background-position: center bottom, left top; 
    background-repeat: no-repeat; 
}

來源

2014-02-26 12:20:14 Sathiyaraj

它只顯示1張圖片，而不是第2張圖片。頁面的其餘部分是白色的。 – user2073133

您需要垂直尺寸設置爲50％左右，其他每個圖像通吃高度

body { 
    background-image: url(http://placekitten.com/300/150), url(http://placekitten.com/200/120); 
    background-size: auto 50%; 
    background-repeat: no-repeat; 
    background-position: top center, bottom center; 
}

fiddle

來源

2014-02-26 17:14:19 vals

由於某種原因它不起作用。當我從背景大小刪除汽車時，我可以看到一個圖像，但是如果我將自動添加到背景大小，我會得到一個空白頁 – user2073133

我在Chrome，Firefox和IE 11中測試了小提琴。您使用的是哪種瀏覽器？此外，如果您更改自動，則將其設置爲100％：background-size：100％50％; – vals

在將body，html {height：100％;}添加到現在的代碼中時。奇怪的 – user2073133

css3堆棧2身體背景圖像

回答

相關問題