我向
question询问了一个特定于我的代码的内容,人们真的很有帮助,所以我选择了更成功的答案,即使我没有解决我的问题.
>我正试图获得像livingsocial一样的大型CSS背景.
>我的图像是1400 x 1050
>我目前的分辨率是：1280 X 1024
>我的图像不断从底部切断
问题(S)：
什么是使用CSS显示大图像背景的最佳方式？
>我是否需要在4种不同的分辨率下使用相同的背景图像,然后使用最适合用户使用的当前分辨率的图像(是否有一些脚本)？
>我是否只需要一个使用css进行缩放的大图像
>其他人如何解决这个问题？
我很想知道这样做的最佳方法是什么,以便在上述三个选项中的所有分辨率下都能正常工作.
解决方法
CSS3解决方案
您可以在CSS3中使用background-origin和background-size,但IE8及更低版本不支持它.
您可以在CSS3中使用background-origin和background-size,但IE8及更低版本不支持它.
PHP解决方案
您可以使用GD2来扩展特定于用户浏览器的图像,此解决方案也将涉及JavaScript.
生活社交方式
他们使用< img />插入图片标记和定位它固定.
<style type="text/css">
#background {
z-index: -1; /* put it under everything*/
position: fixed; /* make it stay in the same place,regardless of scrolling */
top: 0;
left: 0;
overflow: hidden; /* clip the image */
width: 100%; /* fill the full width of browser */
min-height: 950px; /* show at least this much of the image */
}
#background img {
width: 100%;
}
</style>
<body>
<div id="background"><img /></div>
<div id="content"><!-- Your Content Here --></div>
</body>
Living Social有更多代码应用于他们的< img />标签,但它似乎有点多余,也许是为了更好的跨浏览器支持,我没有在这里显示它.
