1

所以我设法为我正在工作的一家新应用程序公司建立了一个网站，其中我使用的是大图像，因为它更容易为我快速设置，但是当浏览器大小调整时它会挤压。有没有办法让图像缩放？这是我的 index.html 文件中的代码。非常感谢您的帮助。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"     "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>WeShould Inc</title>
<style type="text/css">

<!--[if IE 6]>
<style type="text/css">
html {overflow-y:hidden;}
body {overflow-y:auto;}
#page-background {position:absolute; z-index:-1;}
#content {position:static;padding:10px;}
</style>
<![endif]-->
</head>

<body>
    <div id="page-background"><img src="http://i.imgur.com/DJaWd.jpg" width="100%" height="100%" alt="Fireworks"></div>
    <div id="content">

    </div> */


</body>
</html>
4

1 回答 1

3

尝试这个：

<style type="text/css">
html { 
    background: url(http://i.imgur.com/DJaWd.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://i.imgur.com/DJaWd.jpg', sizingMethod='scale')";
</style>

这应该适用于所有浏览器，包括 IE。

使用示例 - http://fiddle.jshell.net/FENXB/1/show/

于 2012-06-30T18:30:57.257 回答