0

ブラウザ ウィンドウに合わせて拡大縮小可能な背景画像を使用するサイトで作業していますが、小さなブラウザ ウィンドウで表示すると問題が発生します。

ページが最初に背の高いブラウザ ウィンドウに読み込まれると、画像はブラウザ ウィンドウの下部に正しく固定され、ウィンドウのサイズが変更されると拡大縮小されます。つまり、ページ全体が含まれている場合は問題ありません。ただし、ページの長さが最初のウィンドウの高さを超える場合、ページをスクロールすると、画像が上にスクロールし、ギャップが残ります。

これはデモンストレーションするページです(最初に背の高いウィンドウで試してから、短いウィンドウで試して、更新して下にスクロールして問題を確認してください):

http://kevin-atkins.co.uk/slc/about-us.html

背景画像をブラウザウィンドウの下部に合わせたり、スクロール時にギャップを残さないようにするにはどうすればよいですか?

4

1 に答える 1

1

正しくサイズ変更できるように、幅\高さを指定する必要があります。

CSS を使用して背景を設定したので、CSS3 Background Size を使用できます。次のように、最新のブラウザのほとんどがこれをサポートしています。

#about-us {
    background-size: 100%;
}

または、100% を占めるイメージ タグとスタイル (幅\高さ) を正しく使用することもできます。

参照:

お役に立てれば。

于 2013-06-10T19:12:40.480 に答える