zoukankan      html  css  js  c++  java
  • vue移动端响应式方案设计

    笔者在这里推荐两个插件  

    postcss-pxtorem、amfe-flexible

    1、postcss-pxtorem 可以实现动态的将px转为rem单位(px to rem),笔者建议大家拖动窗口大小就可以看见效果哦。

    //首先安装
    yarn add postcss-pxtorem --dev

    使用vue cli3/vue cli4 创建的,在项目根目录下有个postcss.config.js,打开在里面添加一下一行配置

    //配置
    plugins: { autoprefixer: {},
    'postcss-pxtorem': { rootValue: 37.5, //这里是px转为rem的基准值,当字体为设置14px时,在通用手机尺寸上显示为14px。 propList: ['*'] } }

    2、amfe-flexible 页面响应式设计

    //首先安装
    yarn add amfe-flexible
    
    //main.js中引入
    import 'amfe-flexible'

    接下来,就可以在页面上使用px单位了,在手机端可以自动适应。

  • 相关阅读:
    Scanner类
    BufferedReader类
    打印类
    管道流
    内存操作流
    转换流——OutputStreamWriter类与InputStreamReader类
    Java字节流与字符流基本操作
    RandomAccessFile类
    File类
    Timer类和TimerTask类
  • 原文地址:https://www.cnblogs.com/uimeigui/p/11831804.html
Copyright © 2011-2022 走看看