响应式网页设计是让页面根据任何可能的屏幕尺寸来调整页面显示，使其在任何设备上都能正常合理的显示。
响应式网页设计并不是一套框架或者新技术，只是一种CSS书写规范，仅CSS即可实现。
共有四个因素：
设计因素
流动布局
- 让网页适应当前的屏幕宽度（甚至高度）
- 通过使用 % （或者vh单位）代替固定的 px，就可以自动根据视窗大小调整
- 使用 max-width 代替普通的 width
响应单位
- 在大多数长度中使用 rem 单位代替 px
- 使其更方便的缩放布局
- 建议令 1rem = 10px 来替代
灵活的图片
- 默认情况下图像并不会在视窗大小变化时自动缩放来适应
- 可以使用 % 和 max-width 来代替原本的图片宽高的设置
媒体查询 Media Queries
- 让CSS样式在视窗大小变成特定大小时改变（如宽度太小时变成类似手机的样式。
- 为不同的设备设计不同的网页布局。