CSS - 用黑色填充網頁的其餘部分

Question

我有一個網頁，其背景圖像需要保持清晰和焦點。

的問題是，要實現它顯然有每次有一組尺寸。

我需要在剩餘的空間用黑色（其將從屏幕尺寸屏幕大小而異）填充的方法。

，看看我說的最簡單的方法是，如果你去的網頁：（無自我宣傳的意思） http://hopeish.com

特別是如果你使用的是Chrome和Firefox - 如Safari是好的和IE不以同樣的方式

任何想法我怎麼能做到這一點受到影響？

Answer 1

background: url(image.jpg) #000 no-repeat; 

Answer 2

您目前有：

body { 
    background: url(image.jpg); 
    background-repeat: no-repeat; 
    /*background-attachment:fixed;*/ 
} 

添加background-color: black;有一個全黑的背景。

body { 
    background-color: black; 
    background: url(image.jpg); 
    background-repeat: no-repeat; 
    /*background-attachment:fixed;*/ 
} 

或者使用在其他答案中看到的簡寫背景屬性變體。

http://reference.sitepoint.com/css/background

Answer 3

可以用簡單的CSS實現。

body { 
    background: url('http://hopeish.com/image.jpg') no-repeat top right black; 
} 

Here's a live example

Answer 4

background:#000 url(image.jpg) bottom right no-repeat; 

這樣您的圖片會在右下角，其餘的將被填充爲黑色。