我有一张尺寸为 2350*180 的图片。
我正在研究电话差距。因此，我需要以通用格式提供代码，以便它适用于任何设备。
现在，我有了一张大图片的背景图片。
style="background:url("img/bg.png") no-repeat fixed center top; width:100%; height:100%; "
这段代码只适用于少数人。我的代码有什么错误吗？
另一个问题，当我滚动时，滚动条是可见的。所以我添加了
style="overflow:hidden;"
<img src=""/> tag.
我是正确的还是应该添加任何其他代码？
编辑:
HTML
<body style="style="background:url("img/bg.png") no-repeat fixed center top; width:100%; height:100%;" class="body">
<div id="image" class="noSelect">
<table class="table">
<tr>
<td class="main">
<img src="http://www.rhpstudio.com/images/google_icon.png" alt="map" usemap="#map" style="overflow:hidden;" />
</td>
</tr>
</table>
</body>
我在代码中考虑这个背景 background:url("img/bg.png")， 中给出的这张图片是一个示例，但是它的尺寸是2350*180。
EDIT:2-->完整代码
HTML 代码:
<body style="background-image:url(img/bg.png);" class="body">
<div id="image" class="noSelect" style="height:100%;">
<table class="table">
<tr>
<td class="main">
<img src="img/list.png" alt="bloodtestmap" usemap="#bloodtestmap" class="noSelect" style="overflow:hidden;" />
</td>
</tr>
</table>
CSS 代码:
.body, .main_html
{
height: 100%;
margin: 0;
}
.body
{
overflow: hidden;
background-size: 100% 100%;
}
.table
{
width: 100%;
height: 100%;
text-align: center;
}
.main
{
max-width: 100%;
vertical-align: middle;
}
最佳答案
您现在可以将背景图像设置为以各种方式拉伸(stretch)到容器的边缘。如果您不介意图像失真，您可以这样做:
background-size: 100% 100%;
而不是这个(坏了)
style="style="background:url("img/bg.png") no-repeat fixed center top; width:100%; height:100%;"
在你的样式表中试试这个:
body {
background-image:url("img/bg.png");
background-size: 100% 100%;
}
关于html - 如何为位于页面中心的大图像定位背景？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16957030/