未將背景圖像固定在不同的設備上

在桌面上，當我滾動頁面時，背景圖片停留在底部。

在Android設備上，當我滾動頁面時，背景圖像會向上滾動。當我在頁面中間進行刷新時，背景圖像會重新出現在當前視圖的右下角。

在iPad上，背景圖片僅顯示在頁面的最底部。

對於每個平板電腦/手機尺寸，我定義了一個單獨的背景圖像，所以這不是問題。

請參見：http://www.zaanstuc.nl/onze-producten

的CSS：

background:#CFCFCF url('../images/pascal1.jpg') no-repeat 100% 100%; 
background-attachment: fixed;

如何，我可以得到的所有設備固定在右下角的圖片：臺式機，平板電腦和手機嗎？

來源

2014-02-28 PROMES

你的HTML在哪裏？ – Siyah

查看指向HTML網站的鏈接。所有圖像都可以鏈接到id =「page」或id =「page2」。 – PROMES

首先：您的問題非常模糊。其次，我認爲你誤會了fixed。如果你設置一些固定的東西，它必須與你的滾動運動。所以如果向下滾動，背景也必須向下滾動。在桌面上，這種情況正在發生，但由於您的設備很小，因此您的移動設備上的用戶體驗不一樣。然而，在技術上，它是一樣的。

如果你想在右邊的圖像的位置，你可以這樣做：

您可以使用background-position: right bottom;

PS：我注意到，你有你的CSS 10個body和#page2元素。他們不需要，可以刪除。

來源

2014-02-28 16:37:40 Siyah

感謝您的回覆。 1. background：#CFCFCF url（'../ images/pascal1.jpg'）不重複100％100％;是幾種設置的簡寫，包括背景位置：右下; 100％100％等於右下角 2.我聲明我爲不同的設備大小定義了單獨的背景圖像。爲什麼？它節省了帶寬，加載時間等。 Seomd我使用兩個不同的圖像。兩次5等於十個定義。所以我的問題仍然存在：我如何才能在視口右下角的所有設備中獲取圖像。 – PROMES

您可以使用「媒體查詢」爲每個設備設置風格。 – Siyah

謝謝Siyah，我已經做了。這就是爲什麼我在CSS中有很多#page和＃page2元素。 – PROMES

未將背景圖像固定在不同的設備上

回答

相關問題