1

私の Web サイトには、2 つの画像で構成された背景があります。

html{
height:100%;
margin:0;
padding:0;
background-image:url('../images/backgroundbottom.png');
background-repeat:repeat-x;
background-position:bottom;
}
body{
height:100%;
margin:0;
padding:0;
font-family: "arial", "times", "courier";
font-size: 10pt;
color:white;
background-image:url('../images/backgroundtop.png');
background-repeat:repeat-x;
}

HTML のように、本文の背景が Web サイトの動的環境に適応しません。ボディの背景は右側で繰り返されなくなりますが、html はビューポイント全体に拡張されます。Chrome、FireFox、Android、および Safari でこれをテストしました。

html 要素と body 要素はビューポートを埋めません。divこの問題は、 が で右側に押し出されていることが原因である可能性が最も高いposition:absoluteです。

この問題を回避するにはどうすればよいですか?

4

1 に答える 1

1

background-attachment:fixed; を追加してみてください。

background-repeat:x;
background-attachment:fixed;
background-position:bottom; 
于 2012-10-25T17:26:06.393 に答える