我的移動響應網站沒有正確調整大小

Question

我有一個處於開發階段的網站。 默認視圖看起來很好，但是當瀏覽器重新調整大小時，圖像和字體看起來過於拉伸或擠壓，而不是優雅的響應。 我在這附上了兩張圖片。 請告知錯誤。 謝謝。

Answer 1

如果圖像是背景，請嘗試添加：

background-size: cover;

那些div。

這將使圖像足夠大以填充其容器，同時保持原始比率。

如果圖像只是一個img而不是背景圖像，如果你切換它，它應該工作。

Answer 2

使用背景圖像添加此CSS時，所有瀏覽器大小的100% width均為100% width 。 添加此css后圖像不會拉伸。

background-position: center center; 
background-repeat: no-repeat; 
background-attachment: fixed; 
background-size: cover; 
height: 100%; 
width: 100%;