响应式布局

页面的设计和开发根据用户行为和设备环境进行调整和响应
Content is like water

1
2

<meta name="viewport"content="width=device-width,initial-scale=1,maximum-scale=1,
user-scalable=no">

1.width=device-width:自适应手机屏幕的尺寸宽度
2.maximum-scale:缩放比例的最大值
3.inital-scale:缩放的初始化
4.user-scalable:用户可以缩放
实现响应式布局的方式
1.媒体查询
2.百分比
3.vw/vh
4.rem
响应式设计实现通常会从以下几方面思考：
1.弹性盒子和媒体查询等
2.百分比布局创建流式布局的弹性UⅡ，同时使用媒体查询限制元素的尺寸和内容变更范围
3.相对单位使得内容自适应调节
缺点：
1.仅适用布局、信息、框架并不复杂的部门类型网站
2.兼容各种设备工作量大，效率低下
3.代码累赘，出现隐藏无用的元素，加载时间加长
4.一定程度上改变了网站原有的布局结构