理想适口

  <!--  理想适口 -->
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scalc=1, maximum-scale=1, user-scalable=no">

    <!-- 
      代码意义：
            width=device-width     宽度等于设备宽度
            initial-scale=1             初始化缩放比例为1
            minimum-scale=1        最小缩放比例为1
            maximum-scale=1       最大缩放比例为1
            user-scalable=no        不允许用户缩放
   -->

移动端布局步骤

1. 确定那的设计稿出自于哪一个屏幕

• 就是为了确定dpr确定设备像素比

2. 根据设备像素比值，确定CSS像素

• CSS像素 = 物理像素比 / dpr，可以这样理解：css像素 = 测量距离/2

3. 引入理想适口 meta标签引入
4. 引入 icon 图标，引入自己得CSS样式，通过link引入