我的移动响应网站没有正确调整大小

Question

我的网站处于开发阶段。默认视图看起来很好，但是当浏览器重新调整大小时，图像和字体看起来过于拉伸或挤压，而不是优雅的响应。我在这附上了两张图片。请告知错误。谢谢。

Answer 1

如果图片是背景，请尝试添加：

background-size: cover;

对那些div。

这将使图像足够大以填充其容器，同时保持原始比率。

如果图像只是一个img而不是背景图像，如果你切换它，它应该可以工作。

Answer 2

当您使用背景图片添加此CSS时，所有浏览器大小都需要100% width。添加此css后图像不会拉伸。

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