0

背景画像が回転する Web ページを作成しています。localhost での開発では、画像内の人物が配置したい場所に配置されるように配置しました。ただし、サーバーにプッシュして別のブラウザーで Web ページを開くと、一部の人が画面から外れており、結果はブラウザーごとに異なります。

これは私が使用しているCSSです

.animate-this .img1,
.animate-this .img3 {
    clear: left;
    display: block;
    width: 100%;
    height: 1210px;
    margin-left: auto;
    margin-right: auto;

}
.animate-this .img2 {
    clear: left;
    display: block;
    width: 1620px;
    height: 1210px;
    margin-left: auto;
    margin-right: auto;
    background-color: #2b292b;
    background-repeat: no-repeat;

}

.animate-this .img4 {
    clear: left;
    display: block;
    width: 1522px;
    height: 1210px;
    background-color: #2b292b;
    background-repeat: no-repeat;

}
4

1 に答える 1

0

あなたが提供したリンクを確認しました。以下のCSSが参考になるかと思います。

.animate-this .img1,
.animate-this .img3 {
    clear: left;
    display: block;
    width: 100%;
    height: 1210px;
    margin-left: auto;
    margin-right: auto;

}
.animate-this .img2 {
    clear: left;
    display: block;
    width: 100%;
    height: 1210px;
    margin-left: auto;
    margin-right: auto;
    background-color: #2b292b;
    background-repeat: no-repeat;

}

.animate-this .img4 {
    clear: left;
    display: block;
    width: 100%;
    height: 1210px;
    background-color: #2b292b;
    background-repeat: no-repeat;

}

また、あなたのページで 1 つのことに気付きました。スクロールするたびに、すでにページにある 3 ～ 4 個の画像がページに追加されます。これらは非常に大きな画像であるため、ページが重くなります。そのため、繰り返しページに画像を追加せずに画像をスクロールできるかどうかを確認してください。

于 2012-08-27T07:01:09.197 に答える