Html 图像未在正文背景上完整显示
例如： 完整图像： 正如您所看到的，我有一个Html 图像未在正文背景上完整显示,html,css,background-image,Html,Css,Background Image,例如： 完整图像： 正如您所看到的，我有一个主体，主体有一个头部偏移量，主体有一个图像背景。然而，这张图片并没有全部显示出来 问题: 我可以用CSS做些什么来显示整个图像，还是需要使用Gimp或photoshop来缩小我的图像。目前为1400 x 1050像素 CSS2现在允许您缩放背景图像。根据用户的分辨率，您可以使用一个穿透并显示不同的图像 顺便说一句：URL参数不需要引号： background-image: url(http://s1.postimage.org/gkkq9uc1
主体我可以用CSS做些什么来显示整个图像，还是需要使用Gimp或photoshop来缩小我的图像。目前为1400 x 1050像素 CSS2现在允许您缩放背景图像。根据用户的分辨率，您可以使用一个穿透并显示不同的图像 顺便说一句：URL参数不需要引号：
background-image: url(http://s1.postimage.org/gkkq9uc17/Sketch2.jpg);
在您的示例中，根本不显示图像。我怀疑这是因为您使用postimage.org托管映像，并且他们阻止了来自外部域的映像请求（您的示例）。如果我将URL替换为托管在我自己的服务器上的图像，则将使用您设置的属性显示图像背景。我建议使用不同的图像主机
CSS3
背景尺寸：封面属性”将根据水平宽度按比例缩放图像以填充浏览器。应该不需要事先缩放图像，尽管这可能并不总是给你最漂亮的结果。是的，你可以使用HTML和CSS做一些技巧，但你的图像必须在标签中：
CSS:
HTML:
检查jsbin:我认为您正在尝试使图像适合窗口，即使这意味着图像失真
您可以使用已使用的背景大小属性来实现这一点。但是，您将其设置为100%100%
，而不是cover
。实例：
我不明白…我遇到的问题不是分辨率，而是我的图像被从底部剪切。我已经更改了主机并更新了链接。所以为了得到最漂亮的结果，我应该缩小原始图像的比例？什么是好的维度？还是反复试验？这取决于您希望用户下载的内容-您可以将其保留为当前大小，对于任何较小的浏览器窗口，它都会缩小，但文件大小会相当大。当您在比图像宽的窗口上放大时，图像外观会出现问题，但您无法真正避免。通过调整浏览器大小进行测试-这将导致背景缩放。注意：背景大小：封面；只能在最近的浏览器中正常工作。此外，它将根据宽度按比例缩放，因此如果您的浏览器在宽屏显示器上全屏显示，则图像底部将在浏览器底部脱离屏幕。关于如何设置这样一个灵活的背景的更多信息可以在这里找到：现在可以了，请尝试。请让我知道是缩小图像还是我应该在CSS中做些什么。如果我必须缩小图像的比例，那么理想的尺寸是什么？这里有一个当前使用的屏幕分辨率列表：…我应该有所有这些分辨率的图像吗？并使用媒体查询显示相对图像？？这是我想要的！然而，有了这个，我不能有我的header@yogashi您可以在页眉高度的图像中添加额外的空格
html, body, #body { height:100% }
#body { position:relative }
img {
position:absolute;
width:100%;
height:100%;
display:block;
z-index:1;
}
div#masthead {
background-color: #262626;
height: 85px;
padding: 0;
width: 100%;
margin: 0;
z-index:2;
position:relative
}
<body>
<img src="http://i53.tinypic.com/347a8uu.jpg">
<div id="masthead"></div>
</body>
body {
background: url(http://i53.tinypic.com/347a8uu.jpg) no-repeat center fixed;
background-position: 0px 85px;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
background-size: 100% 100%;
}