.1一个网站：
    1. PC网站(https://www.taobao.com/) 2. 移动端网站(https://h5.m.taobao.com)
    这是两个不同的网站，分开来制作，非常适合大网站。
    .2 media queries : 用一套代码去实现PC端和移动端。PC站和移动站差别不是很大，这样就可以实现响应式布局。比较适合做小网站。
    @mediaall and (min-width: 500px) {
    #box{ width:100px; height:100px; background:red;}
    }最小宽500px，宽小于500px，后续属性均不显示
    @mediaall and (max-width: 500px) {
    #box{ width:100px; height:100px; background:red;}
    }最大宽500px，宽大于500px，后续属性均不显示
    @mediaall and (min-width: 500px) and (max-width: 700px) {
    #box{ width:100px; height:100px; background:red;}
    }最小宽500px，最大宽700px，在宽500px~700px下显示
    @media not all and (min-width: 500px) and (max-width: 700px) {
    #box{ width:100px; height:100px; background:red;}
    }在宽小于500px，和大于700px下显示
    @mediaall and (orientation:portrait){
    #box{ width:100px; height:100px; background:red;}
    }竖屏的时候才会显示
    @mediaall and (orientation:landscape){
    #box{ width:100px; height:100px; background:red;}
    }横屏的时候才会显示
    响应式布局？
    要写：
    写media的顺序，在CSS中最后写适配的代码。
    适配的时候，从PC降级到移动设备。
    响应式常见的样式修改：
    display : block / none
    float : left / none
    width : 100px、200px / 100% 25%
    text-align : left / center
    .3 移动端布局？
    专门针对移动端：流式布局 rem布局
    即针对PC又针对移动：响应式布局（媒体查询 , 1024以上 1023~768 767以下）
    PPI?
    1英寸有多少个物理像素 大于320：高清 大于400：超高清
    device-width : 让CSS像素跟设备独立像素相同，来保证设计跟制作是吻合的。
    .4 移动端基本概念
    PPI
    1英寸有多少个物理像素
    大于320：高清 大于400：超高清
    .PPI计算： 屏幕尺寸 5.2英寸
    屏幕分辨率 1920 X 1080
    PPI： 423
    （1920 x 1920 + 1080 x 1080 ）开根号=2202
    2202 / 5.2 = 423.4615
    CSS像素
    浏览器使用的抽象单位，css中的1px并不是总代表设备像素上的1px，尤其是在移动设备上。
    单位 px
    设备像素
    设备像素又称物理像素，设备能控制显示的最小单位，我们可以把这些像素看作成显示器上一个个的点。是一个相对单位，不同的屏幕尺寸下，像素可能相同。
    单位px
    设备独立像素
    设备独立像素也叫密度无关像素，是一种物理测量单位。由底层系统的程序使用，转换为物理像素的应用。
    单位dp
    像素比
    window.devicePixelRatio
    设备像素与设备独立像素的比值
    设备像素 : 1334750 19201080
    设备独立像素 : 667375 736414
    iphone6/7/8 : 像素比 2
    iphone6/7/8 plus : 像素比 3
    语义化标签：强调
    : 加粗
    : 斜体
    不具备语义化，只有样式
    : 加粗
    : 斜体
    : 定义文字方向。
    html{ font-size : 26.666666vw;}
    body{ font-size : .16rem; }