2017-10-28 141 views
1

我在iOS設備上強調背景的問題。它只在我將內容添加到頁面時才伸展like this.它在空白頁面like this上正確加載。我讀到它與添加background-attachment:scroll而不是background-size: cover有關。將它添加到CSS時,我沒有任何更改。我必須使用錯誤的內容ID。在爲移動主題製作更多圖片之前,我想知道是否可以使用代碼修復它?任何幫助將不勝感激。iOS移動設備拉伸背景圖像

+0

,我會把這個代碼,以固定定位它基本上是從DOM刪除元素和? –

回答

1

視差效果的基礎上的概念,背景圖像會留在原地有一個固定的位置,同時拉伸,以適應其容器。不幸的是CSS本身不會讓它發生。

一旦您設置相對於窗口

section 
{   
    position: fixed; 
    top: 0; 
    bottom: -72px; 
     background-image: url(http://bgImage); 
    background-size: cover; 
    background-attachment: fixed; 
} 
+0

非常感謝。我必須將部分更改爲#primary以使其更改。我通過取出頂部和底部填充的代碼修復了它創建標題之上的帖子的問題。背景現在看起來很棒。再次感謝你。唯一的問題是頁面上的內容被切斷。我也無法滾動,因爲它將頁面上的播放器和社交圖標切斷。這是我需要添加到解決它的位置嗎? –

+0

好的太棒了! @BryanHoward你可以試試這個位置:絕對;頂部:0;左:0;可能是它的幫助! –

+0

絕對有幫助。它顯示內容更多,背景仍然正確,我現在可以滾動。然而,它仍然從頂部屏幕的大約80%處切斷。我是否還需要更改底部的填充? –

0

嘗試添加該代碼的HTML head標籤裏:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui"> 
+0

你好,對於遲到的回覆抱歉。我只是試圖將其添加到我的HTML頭標籤,但不幸的是沒有看到任何改變。 –

+0

Np,很高興你找到了答案! – Brian