背景圖像不會顯示在手機瀏覽器

我有以下CSS爲了在我的頁面背景上獲取圖像，並在其周圍添加顏色。背景圖像不會顯示在手機瀏覽器

#home{text-align:center;background:Red url('/Content/image.png') no-repeat fixed center;}

當我使用任何瀏覽器（我更喜歡Chrome）在計算機上運行它時，一切正常。但是，當我在手機上打開網站時（也使用Chrome），我只能看到背景顏色，而不是圖像。但是，只要我移除中間部分（背景位置），我就可以看到它。

有什麼想法？

2013-02-23 user304429

試'背景image'代替 – 2013-02-23 19:31:44

我單獨做所有這些（背景顏色，背景圖像，背景重複...）以及相同的結果。 – user304429 2013-02-23 19:56:50

什麼型號的手機？你是否嘗試使用相對路徑？ – 2013-02-23 21:33:34

經過一番搜索，我發現超過1024像素的圖片不會顯示在iDevices上。我用媒體查詢來更改背景，如下所示：

@media all and (max-width:900px), (max-device-width:900px){ 
body{ 
background-image: url('smaller-image.gif'); 
} 
}

希望能幫助別人。

2013-09-04 17:07:11

我一直在搞亂我的CSS爲小時試圖獲得背景圖像顯示在iOS7或更舊的設備上，沒有運氣。我將圖像的寬度更改爲1024px（從3000px），現在可以使用。非常感謝！ – GuerillaRadio 2015-09-30 10:34:04

我面臨同樣的問題，然後我申請了background:url("../img/pic1.jpg") no-repeat center;它的工作，你可以嘗試，如果你面臨的問題在ios。

2016-02-09 13:55:03

現在，圖片寬度是否超過1024px並不重要。這引起了不顯示背景圖片，我的問題是：background-attachment: fixed;

在這種情況下，只是改變這一行background-attachment: scroll;與@media查詢

2017-11-09 15:44:28

回答