保持背景图像居中

好的，所以我想模仿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

保持背景图像居中

回答

相关问题