技术选型

计划:采纳独自制作挪动端页面

技术选型:rem适配布局(less+ rem+ 媒体查问)

采纳750px设计尺寸

步骤

1.搭建相干文件夹构造

2设置视口标签及引进css初始化款式

    <!-- 设置视口标签 -->    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">    <!-- 引进css初始化款式 -->    <link rel="stylesheet" href="./css/normalize.css">

3.新建common.less文件

  • 新建commem.less文件,设置好常见的尺寸,利用媒体查问设置不同的html字体大小
  • 关怀的尺寸有320px,360px,375px,384px,400px,414px,424px,480px,540px,720px,750px
  • 划分的分数设置为15等份
  • pc端设置的html字体为50px(写在最下面)

4.新建index.less文件

  • 新建index.less文件 指的是首页的款式
  • 将方才设置好的common.less文件导入index.less外面。
  • 最初把index.css文件引入html文件中

@import 'common';