上一遍文章讲到了viewport，但是通过效果图我们可以看出来，有部分网页内容超出浏览器的宽度，以至于浏览器出现水平滚动条。
这一遍文章主要就是来解决这个问题。
第一种是：设置viewport，高度固定，宽度使用百分比
这种对于简单的列表形比较实用。这种布局方式，通过要为高度进行响应式。
第二种是：设置viewport，宽度和高度都固定，利用浏览器本身的功能进行缩放
这种布局方式不仅适合列表方式，也可以适用于一些复杂的布局。
根据设计稿的大小，直接设计viewport中的width为设计稿的像素宽度即可。然后原生的高宽均按照设计稿中的要求设计即可。
当设备的像素高或低于我们的viewport width的时候，浏览器会自己进行缩放的。（极少部分浏览器无法进行缩放，这个时候可以使用脚本进行动态设置viewport）。
第三种是：动态设置viewport，高宽度都使用相对单位
同第二种一样，适合于复杂的布局。
根据设计稿将各元素的单位换算成rem，然后根据屏幕大小，换算html的font-size。
参考资料：
368
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
