zoukankan      html  css  js  c++  java
  • 移动视口,以及适配

    ---【移动视口标签】:

      = <meta name="viewport" content="width=device-width,user-scalable=no,

               initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">

    ---【移动端的css初始化】  normalize.css   样式表

    ---【rem 实际开发适配方案】: rem+媒体查询+less 技术

      1,假设设计稿是750px

      2,假设划分为15等分,可以是10分

      3,每一份,作为html字体大小,这里就是75px

      4,那么在320设备的时候,字体大小就是32px

      5,用我们页面元素的大小除以不同的html 字体大小会发现他们比例还是相同的

      html:{ font-size:50px}

      = @num;

             @media screen and (min-320px){

        html{  font-size:320px/@num  }

      }

            @media screen and (min-360px){

        html{  font-size:360px/@num  }

      }

            @media screen and (min-750px){

        html{  font-size:3750px/@num  }

      }

    --=引入设配     @import "xxx.适配。js"

  • 相关阅读:
    绝对相等与弱相等
    css3之媒体查询
    css3新增选择器
    BFC渲染机制
    css优先级及其对应的权重
    滚动指示器
    web储存的初级运用
    setTimeout与setInterval的使用
    原生js获取left值和top值
    canvas圆形进度条
  • 原文地址:https://www.cnblogs.com/zzhqdkf/p/12495211.html
Copyright © 2011-2022 走看看