适配

应考虑大多数常用设备的浏览问题

不同的设备适用于不同的测量单元。屏幕的显示原理是在一个屏幕上布置多个发光二极管。

1. 物理像素

   屏幕上的每个发光点都是物理像素

2. 逻辑像素 px

   逻辑像素的出现是尽可能平衡不同物理像素设备之间的显示差异。

几种常用设备的物理像素和逻辑像素

em 与当前对象相比 font-size 例如，当前元素设置 font-size:20px;那么 2em 就是 40px 是它的多少倍。如果当前元素没有指定， font-size 那么将继承父元素 font-size ，若均为值指定，默认为 16px;

rem 是相对于 HTML 节点的 font-size 属性指定的 px 当页面中的元素改变字体大小时，不会影响其他元素。rem 是 CSS3 的属性

这是一个相对原始的适应方案，没有兼容性问题，但问题是使用百分比往往不是整数，如果有固定宽度和高元素，使用百分比不利于分配空间。建议在需要打开整个屏幕时使用百分比。

根据屏幕宽度选择 一套合适的样式代码，可以通过媒体查询，根据淘宝的适配方案可以分为 990px、1024px、1190px、1279px、1365px、1440px 这几档

我们只需要控制 html 的 font-size 可以获得相应尺寸的属性（ rem 是 CSS3 的属性 ）Rem 最终转换的值仍然是 px，因此，如果需要按比例分配，则需要配合其他适配方案

是 CSS3 属性，不需要刻意排列元素的位置，优点是简单易用，排列方法多样。