2

ウィンドウのサイズを変更すると、背景画像も移動してサイズが変更されます。サイズを変更したくないので、静的なままにしておきます。背景を静的に保つ方法が本当に混乱しています。幅をピクセル単位で設定すると、静的なままになりますが、画面サイズが異なるため、これは適切なオプションではありません

body {
    background-color: #000000;
    margin: 0 auto;
    width: 100%;
}

#container {
    background: url("url") no-repeat scroll center top transparent;
    width: 100%;
}

コードは次のようになります。

<body>
<div id="container">
</div>
</body>
4

3 に答える 3

1

このコードを試してください -

#container {
    background: transparent url("url") 0 0 no-repeat;
    width: 100%;
}
于 2013-04-02T07:09:15.467 に答える
0

画像を に設定するとwidth:100%、画像は画面に合わせてサイズ変更されます。スケーリングせずに上部中央に配置したい場合はposition:fixed、明示的に使用widthしてから正しく配置できます。

#container {
    background:url("url") no-repeat scroll center top transparent;
    background-position:fixed;
    position:fixed;
    width:500px; /* width of image */
    height:auto;
    top:0;
    left:50%;
    margin-left:-250px; /* -1/2 width */
}
于 2013-04-02T07:09:12.227 に答える