为响应式模板调整html中的背景图像大小[重复]答案

【问题标题】：Resize background image in html for responsive template [duplicate]为响应式模板调整html中的背景图像大小[重复]
【发布时间】：2014-05-21 14:53:44
【问题描述】：

我正在练习制作响应式网站我的问题是如何根据网页的分辨率调整图像大小？这是我的代码：

<html>
<head>
<meta charset="utf-8">
<style>
body {
    background: url("streetlight.png");
    width: 100%;
    height: 100px;
    background-attachment: fixed;
    position: absolute;
    background-repeat: no-repeat;
}
</style>
</head>
<body>

</body>
</html>

【问题讨论】：

你在看背景图吗？还是 IMG 标签？
背景尺寸：100% 100%;
@ShibinRagh 背景图片
@CullyLarson 哎呀抱歉
@thenewbie 你检查我的答案了吗？

标签： html css image

【解决方案1】：

试试这个

body{ 
  background: url(streetlight.png) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

【讨论】：

是的，我只是发布了这个解决方案，因为我在尝试制作响应式模板时也遇到了类似的问题。这就是为什么我记得解决方案
图片适合整个页面，它不会根据浏览器的分辨率调整大小。