HTML背景

我想讓我的網頁。我非常有效地使用Photoshop製作了一個佈局，它是一個PNG文件。HTML背景

我的問題是 - 我如何使用HTML/CSS將其整合到網站中？我試着編輯css哪種工作。

body { 
background-image:url('URLAddressHere'); 
}

然而，當我放大窗口，等等，等等......像剛剛被糟蹋了。有沒有辦法使頁面大小適當縮放背景？另外，我希望它保持統一（即不重複）或者我只是做錯了嗎？我怎麼是爲了執行這個「形象」基本上有我的菜單等

感謝

來源

2012-03-24 user432584920684

顯示HTML代碼。 – slash197 2012-03-24 09:03:54

使用「div」包裹背景圖像，並在此「div」外使用顏色或重複圖像。 – Mosijava 2012-03-24 09:04:35

http://stackoverflow.com/questions/376253/stretch-and-scale-css-background http://stackoverflow.com/questions/1150163/stretch-and-scale-a-css-image-background- with-css-only http://css-tricks.com/how-to-resizeable-background-image/ – hkulekci 2012-03-24 09:06:52

試試這個：

body { 
    background-image:url('URLAddressHere'); 
    background-repeat:no-repeat; 
}

來源

2012-03-24 09:04:43

什麼你要找的是所謂的背景 - 一個CSS3屬性尺寸。這將根據瀏覽器的寬度和高度來調整背景大小。我已經鏈接了下面的一些資源。您還需要關閉重複。享受

http://www.css3.info/preview/background-size/

因此，對於你的類，你可能需要添加：

background-repeat: no-repeat; 
background-size: cover;

來源

2012-03-24 09:04:55 nickw444

一旦圖像放大，這會使事情變得非常醜陋。 – ThiefMaster 2012-03-24 09:19:51

>獲得更高分辨率的圖像。（世界最差的優化）。 – nickw444 2012-03-24 09:25:39

我想你會想是這樣的....

html { 
    background: url(images/bg.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/bg.jpg', sizingMethod='scale'); 
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/bg.jpg', sizingMethod='scale')"; 
}

來源

2012-03-24 09:18:08 Greg

回答

相關問題