0

「進行中の作業」ページの背景として 1 つの大きな画像を使用した単純なページ構造があります。

問題は、Firefox では 1152x864 の解像度で背景画像が「切り詰められ」、Internet Explorer (および同じ解像度) ではすべて正常に動作するように見えることです。

「切り捨てられた」という意味は、ロゴ、特に「クリエイティブな写真家」というフレーズが、モニターの左側に非常に近いように見えることです。

他の画面解像度 (1200x800、800x600) でも、画像は問題なく表示されます。

ウェブサイトは公開されており、http://www.antoniafiore.comです。

私は何か間違っていますか？どこが間違っているか教えていただけますか？

返信ありがとうございます。

ここにいくつかのスクリーンショットがあります

4

1 に答える 1

2

CSS 3 を使用できる場合は、背景に次のようなスタイルを適用することをお勧めします。

div#bg
{
    background-image: url('bg.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
}

これにより、現在の画面解像度に関係なく、画像が適切にスケーリングされます。これは、ウェブサイトに高解像度の画像を表示するために使用します。

background-size プロパティは CSS 3 に固有のものですが、残りは CSS 2 に準拠しています。また、これに jQuery を使用する必要はありません。ストレートCSS 3で実行できます。

于 2012-10-07T01:22:37.153 に答える