在調整大小時停止移動背景的CSS背景屬性

我最近在最近的問題中發現了這個問題，這個問題與我認爲是Chrome或Safari webkit的bug有關，也可能與我的style.css中的東西有關。不過，我注意到一段時間後，我的背景在調整大小時略有移動，並且我得出結論，當它向右移動時，左側白色邊框不會從屏幕左側的頂部到底部顯示，但是當背景圖片向右側移動，然後在左側顯示一個2px的白色邊框。我該如何阻止邊界移動。在調整大小時停止移動背景的CSS背景屬性

我的CSS：

html { 
    background: url(/assets/fotball.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

來源

2013-01-21 MFCS

你可以創建一個jsFiddle嗎？ –

http://jsfiddle.net/hB2h6/你去了，在頁面的頂部，你可以看到一個隨機出現的白色邊框，如果你去鏈接：http：//www.howtogeek.com/wp-content /uploads/2012/12/Plain-Black-Wallpaper.png你可以看到沒有。如果看不到白色邊框，請嘗試調整JSfiddle頁面的大小。 :) – MFCS

試試這個：

background: url(/assets/fotball.jpg) no-repeat center top fixed;

來源

2013-01-21 12:08:52

沒有工作:(。 – MFCS

在小提琴它填滿了所有空間沒有顯示邊框，可能是在與其他控件（代碼）的網頁頁面更改。你可以提供一些截圖或鏈接來顯示問題在視覺上？ –

以上以上以上... :) – MFCS

更改您的代碼如下：jsFiddle Live Demo

html { 
    background: url(/assets/fotball.jpg) repeat center top fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    background-position:; 
}

當您使用background-size: cover;，這都沒有區別使用background:no-repeat或background:repeat。所以在這種情況下，您可以使用repeat來解決您的問題。

來源

2013-01-21 14:13:32

它確實刪除了白色邊框，但現在添加了一條綠色的線條，因爲足球場是綠色的。而不是白線。更好，但仍不完美。 :(有更多想法嗎？ – MFCS

@MFCS你可以上傳你的背景圖片嗎？所以我可以看到發生了什麼？ –

這裏我正在測試的圖片：http://us.123rf.com/400wm/400/400/piyato/ piyato1110/piyato111000037/10786305-football-on-grass-background.jpg – MFCS

在調整大小時停止移動背景的CSS背景屬性

回答

相關問題