保持背景圖像居中

好的，所以我想模仿Google的主頁。看起來，即使是小圖片，谷歌也會將其拉伸以適應並且不會過多填充它。我嘗試使用背景位置，但它可能看起來不錯，但看起來像其他人的垃圾。所以我的問題是，我將如何能夠使用jQuery來拉動這個技巧？保持背景圖像居中

確定這裏是我使用的ATM

background-repeat: no-repeat; 
background-size: auto; 
background-clip: border-box; 
background-origin: padding-box; 
background-attachment:scroll; 
background-position: 0px 28%; 
position: fixed; 
z-index:-10;

，並在頁面DIV的風格，使用上面，作爲其風格的CSS類背景

<div style="display: block; opacity: 0.99999; width: 1600px; height: auto; left: 0px; right: 0px; top: 0px; bottom: 0px; background-image: url(<?php echo base64_decode($_COOKIE['phx_utmc_session']); ?>);" id="phx_utmc_background"></div>

可能有顯示圖像的CSS在使用寬度作爲高度div部分的一些問題，但我不知道，因爲沒有高度它不會工作。

所以你們^^

來源

2011-05-15 PT Desu

你能解釋一下預期的效果一點？在Google主頁上有一個圖片（徽標），並且它的大小始終相同。 – 2011-05-15 01:20:32

我正在談論谷歌上的自定義背景功能 – 2011-05-15 01:23:19

你嘗試過只用CSS

body { 
    background: url('background.png') no-repeat center right 40% 0 transparent; 
}

雖然我沒有測試過，看來你可以用CSS實現這一目標。

來源

2011-05-15 01:20:36 dockeryZ

是的。我認爲你完全不需要jQuery。 – omninonsense 2011-05-15 01:23:54

您的特定片段已損壞/無所事事。用[jsfiddle]（http://jsfiddle.net/）測試它。 – Raynos 2011-05-15 01:27:55

如前所述，這可以用CSS

完成嘗試

body { 
    background: url('http://placekitten.com/200/300'); 
    background-position: center 0%; 
    background-repeat: no-repeat; 
}

Live link

來源

2011-05-15 01:26:54 Raynos

保持背景圖像居中

回答

相關問題