zoukankan      html  css  js  c++  java
  • 移动端自适应处理页面布局

    处理页面大概会有若干种方案:

    1. 第一种就是使用bootstrap;

    2. 自己使用自适应单位常用的rem,em ,及别人封装好的插件flexble.js;
      在使用flexble.js;时发现两个问题,高度没有很好的展现,有时会比设计稿低,会造成页面扁平不好看,第二种就是容易造成双手指扩大,这个可以在flexble.js 进行配置,在项目index中去掉meta设置,在flexble.js加上nitial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no, shrink-to-fit=no,但是第一个问题没有解决;

    3. 所以放弃使用flexble.js,选用他人使用封装好的rem;是 以750px宽度的设计稿,可以适应大部分手机;但有一点缺陷是早期vivo x7 的一类安卓手机原生浏览器或webview中会出现视觉视口小于布局视口的情况;
      最后综合2,3两个,修改js源码依旧没有调好,最后想到的是宽度设置用百分比,高度用3设置的方案rem;

      希望大神有全部适应的方案给个demo,谢谢;

  • 相关阅读:
    python向mysql中插入数字、字符串、日期总结
    selenium鼠标事件
    iOS hook
    网络抓包篇
    frida IOS环境搭建
    git
    $emit
    better-scroll无法滚动的问题。
    this.$nextTick()作用
    better-scroll
  • 原文地址:https://www.cnblogs.com/panax/p/8659015.html
Copyright © 2011-2022 走看看