圖像不能在較小的瀏覽器中調整大小

我想將圖像放在頁面的右下角，並始終在那裏。我已經設法做到了這一點，但是在縮小瀏覽器窗口時遇到了一些問題（在使用較小屏幕的不同建議中查看它時也存在問題）。當我縮小瀏覽器時，圖像保持相同的大小，並最終與其他項目重疊（例如我的菜單）。無論如何要讓圖像與瀏覽器一起自動變小？圖像不能在較小的瀏覽器中調整大小

我已經習慣了將圖像放置在右下角的CSS代碼如下：

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

的圖像是放在一個div裏面我的HTML PNG圖像。

我希望有人能明白我的意思，並幫助我這個！

來源

2013-03-15 Sara Shellhammer

你需要絕對定位來完成這個，而不是FLOATS。 – 2013-03-15 18:27:18

您可以爲圖像提供一個寬度而不是像素寬度的百分比。當您調整窗口大小時，它將調整大小。嘗試設置width: 20%作爲起點，看看會發生什麼。

來源

2013-03-15 18:31:10

使用%值的圖像的寬度和高度應該工作。

來源

2013-03-15 18:33:59 Bruner

你可以試試這個

<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-15 18:35:09 Nikhar

不要在這種情況下使用浮動，您的定位應該是絕對的，不要設置基於像素的尺寸。如果你想設置它的大小，你可以按百分比來做，但是，也許最好的解決方案是爲單獨的屏幕大小設置不同的主題。

來源

2013-03-15 23:47:31

圖像不能在較小的瀏覽器中調整大小

回答

相關問題