给图片设置max-width:100%，可以让图片在外框过大的情况下，不至于拉伸，变得像素化。容器小于图片的尺寸的时候，图片也能够压缩自动适应。

虽然可以让前端显示的正常，但是不能因此就使用大尺寸的图片，合适的图片是最好的，一些制作粗糙的应用，使用一些几M的图当做thumb缩略图显示。

用户不仅打开的慢，还费流量，增加用户成本，尤其是按照流量计费的用户，直接浪费了用户的钱。

根据你的可视窗口来设计你的页面是非常有用的。  
vh = viewport height   1vh = 1% viewport height
vw = viewport width   1vw = 1% viewport width

例如，如果您希望在内容的其余部分之前显示一个整页的hero部分，则将页面的该部分设为100vh高会将其余内容推到视口下方，这意味着只有在滚动文档时才会显示该部分。