2

私のサイトの幅に沿って走る画像があります。幅が100％に設定されたdivに含まれています。画像自体の幅は2560pxです。

現在ページが長くなっているので、画像をブラウザビューのページと同じ幅にしたいのですが。

画像の幅を100％に設定するだけで、画像が小さくなり、不均衡になります。

検索では、を100％に設定することで可能になる可能性がありますmax-widthが、これは画像の終わりを切り取るだけです。

中央揃えを維持する方法はありますか？つまり、画像の両端をトリミングして、常に中央に配置されるようにする方法はありますか？

どうもありがとう。

4

2 に答える 2

1

私はあなたが探しているのはこれです：

http://jsfiddle.net/promatik/hFsYv/

HTML：

<div id="bg-div"></div>

CSS：

#bg-div {
    position: fixed;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-attachment:fixed;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

これにより、背景がdivの中央に配置され、最適な方法でdivを塗りつぶすようにトリミングされます。

于 2013-03-24T19:04:00.460 に答える
1

を使用background-imageして設定する必要があります。

これにより、次のように簡単に中央に配置できます。

body{
background: url("path/to/image") no-repeat fixed center top; 
}

center-画像を中央に配置します

top-画像を垂直方向に調整します

no-repeat-背景が繰り返されないようにします

fixed-スクロールしながらフォローします

これらすべてのプロパティが必要なわけではない場合があります。探しているのは中心です。

于 2013-03-24T19:08:19.173 に答える