静态布局：页面的宽高是固定的，超出页面的内容用户手动拖拽。手机端的话，另外设计一套。
自适应布局：用媒体查询（@media）根据不同屏幕定义不同的宽高，比静态布局少了用户手动拖拽的几率。
（因为媒体查询范围不能做到无穷的刚刚符合各个屏幕，页面内容不多不多少的和屏幕大小一样，不用到拖拽）
流式布局：页面的宽度用百分比来分配，屏幕度数跨度太大页面整体浏览效果不好，用户体验差（跨度可以说是从pc到手机）
响应式布局：是用了自适应的媒体查询 和 流式布局的百分比相结合。（图片、视频用百分比。字体用rem或em）
响应式优缺点：
优：
灵活性：面对不同分辨率设备灵活性强
节省成本：不需要开发pc端和移动端两套页面
SEO友好：pc端和移动端的公用一套页面积累url用户访问和分享
缺：
对老IE的不兼容：不支持媒体查询
浏览速度慢：兼容不同的分辨率设备，样式随之也会增多