如何为位于页面中心的大图像定位背景？答案

【问题标题】：how to position a background for a big image which is centered at the center of the page?如何为位于页面中心的大图像定位背景？
【发布时间】：2013-06-02 03:54:21
【问题描述】：

我有一张尺寸为 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;
    }

【问题讨论】：

标签： html css cordova media-queries cordova-2.0.0

【解决方案1】：

您现在可以设置背景图像以多种方式拉伸到容器的边缘。如果您不介意图像失真，您可以这样做：

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%;
}

【讨论】：

好的，看我修改后的答案。
这个背景有一个设计，所以不断重复。当我给这个no-repeat fixed center top; width:100%; height:100%;。背景是固定的，只有图像滚动。 我应该怎么做才能避免滚动条
不，先生。我已经听从了建议，那时我注意到背景的设计正在重复。我希望它位于同一位置，只允许图像滚动
你能给我们看一个你在做什么的例子吗？或者至少发布您现在拥有的代码？
先生，请找到具有完整 html 代码及其各自 CSS 的 edit 2 版本。