作爲背景圖片

我有一張圖片作爲背景。在我有一個滾動條之前，現在它已經消失了。這就是我想要的。作爲背景圖片

我面對現在的問題是是：

在桌面上，它不顯示我的全貌。例如杯子和手機，我的照片被削減了一半。

我能做些什麼來將整個圖片作爲桌面和移動設備的背景？

這是網頁：http://odsgaardklausen.dk/DBS/DBS.php

並嘗試查看它在移動設備上，這樣你就可以明白我的意思。

我的CSS

/* CSS Dokument */ 
    body{ 
     background: url(baggrund.jpg) no-repeat center center fixed; 
     -webkit-background-size: cover; 
     -moz-background-size: cover; 
     -o-background-size: cover; 
     background-size: cover; 
    }

來源

2015-06-29 KamK

PLZ添加代碼.. –

'背景尺寸：100％100％'？但圖像會縮小。只設置'background-size：100％'會顯示完整的圖像，但它不會覆蓋整個div。 –

這將解決您的圖像的裁切：

body { 
    background: url(baggrund.jpg) no-repeat; 
    -webkit-background-size: 100%; 
    -moz-background-size: 100%; 
    -o-background-size: 100%; 
    background-size: 100%; 
}

但現在的圖片不會填充整個背景。問題不在代碼中。您嘗試使用一個圖像來適應所有可能的分辨率。如果沒有一些消極方面的話，這是不可能的，比如種植。

您至少需要三種不同的圖像才能獲得像手機，平板電腦和桌面這樣的斷點。

嘗試閱讀一些關於響應式網頁設計和媒體查詢。

http://sixrevisions.com/css/responsive-background-image/

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

希望這有助於

來源

2015-06-29 12:28:51 AbeCodes

謝謝。但是，當我把中心中心固定起來，並且只使用不重複時，我可以再次滾動，這並不好。：D正如你現在可以這樣：http://odsgaardklausen.dk/DBS/DBS.php – KamK

我沒有看到鉻，safari和FF上的任何滾動條。當我嘗試在Chrome和Safari瀏覽器中滾動時，我看到一些空白區域，但是這是webkit「功能」;）看起來像以前一樣，只是沒有拉伸圖像（我通過devtools添加了中心中心並再次覆蓋）。但無論如何，你將需要更多的圖像和斷點;） – AbeCodes

對不起，如果我問得太多。但我只是開始編程。但問題是，當我滾動時，我不知道有什麼空白空間。背景圖片是我想要的唯一圖片，這就是爲什麼當我滾動時，我不想要空白區域，但只是圖片靜止且快速：D – KamK

作爲背景圖片

回答

相關問題