1

ページの右下隅に画像を配置して、常にそこに表示しようとしています。私はこれをなんとか行うことができましたが、ブラウザウィンドウを小さくすると問題が発生します(これは、小さい画面でさまざまなアドバイスで表示するときにも問題になります)。ブラウザを小さくすると、画像は同じサイズのままになり、最終的には他のアイテム(たとえば、メニューなど)と重なります。ブラウザと一緒に画像が自動的に小さくなるようにする方法はありますか?

画像を右下隅に配置するために使用したcssコードは次のようになります。

display:block;
float:right;
bottom:0;
right:0;
width:340px;

この画像は、私のhtmlのdiv内に配置されたpng画像です。

誰かが私の意味を理解し、これを手伝ってくれることを願っています!

4

4 に答える 4

2

ピクセル幅の代わりに幅のパーセンテージを画像に与えることができます。ウィンドウのサイズを変更すると、サイズも変更されます。width: 20%開始点として設定してみて、何が起こるかを確認してください。

于 2013-03-15T18:31:10.483 に答える
1

これを試すことができます

<html>
<style>
img{
position:absolute;
bottom:0;
right:0;
max-width: 100%;
height: auto;
width: auto; 
}
</style>
<body>
<img src="slide2.jpg"/>
</body>
</html>

ブラウザのサイズ変更も画像のサイズを変更し、常に下部にあります。

于 2013-03-15T18:35:09.823 に答える
0

この場合はフローティングを使用しないでください。位置は絶対的なものにする必要があり、ピクセルベースのサイズを設定しないでください。サイズを設定したい場合は、パーセンテージで設定できますが、画面サイズごとにテーマを分けるのが最善の解決策かもしれません。

于 2013-03-15T23:47:31.993 に答える
0

%画像の幅と高さの値を使用するとうまくいくはずです。

于 2013-03-15T18:33:59.723 に答える