自适应视口单位

截至目前，我所掌握的自适应实现方式主要有以下两种：

1. 在移动端应用中，通过rem单位相对于根HTML元素进行调整，借助一段JavaScript代码实现移动端的自适应效果
2. 采用纯CSS视口单位来实现页面的自动适配

纯CSS3使用vw和vh视口单位实现自适应
像素与浏览器视口的细节
使用VH和VW实现真正的流体排版
谈谈rem与vw — rem

所谓“自适应布局”，也被称为响应式布局，其核心在于针对不同设备、不同屏幕尺寸以及不同分辨率下的页面布局进行自动调整。从我的理解来看，这主要体现为在任何设备或窗口尺寸发生变化时，页面内容能够按比例进行缩放。

实现响应式布局的关键技术手段是媒体查询（Media Queries），通过@media规则可以根据不同的屏幕尺寸设定相应的样式规则。

利