只要在每个页面加入这段js他会把每个页面平均分成横向25rem,纵向47rem//页面布局

<script>
(function(doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
window.clientWidth = docEl.clientWidth;
if(!window.clientWidth) return;
docEl.style.fontSize = 30 * (window.clientWidth / 750) + 'px';
window.base = 30 * (window.clientWidth / 750);
};
if(!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
</script>

h5整体页面布局的更多相关文章

  1. h5单页面布局

    前段时间做了一个PC端单页面应用 GitHub因为项目开始的比较仓促,加上本人前端经验特别少,虽然项目大体完成了,但是页面布局确成立它的硬伤...为了填补心里落差,专门做了一个h5的单页面布局,代码很 ...

  2. app开发,H5+CSS3页面布局小tips

    1.inline-block使用后带来的间隔影响 2.竖线的处理 3.ssh公匙 4.星星组件的巧妙用法 5.api.js的$api对象与 安卓原生引擎的api对象,均相当于jQuery的$对象 6. ...

  3. CSS3与页面布局学习总结(四)——页面布局大全

    一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...

  4. CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  5. CSS3与页面布局学习笔记(八)——浏览器兼容性问题与前端性能优化方案

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  6. SharePoint 2013 入门教程之创建页面布局及页面

    在SharePoint的使用过程中,页面布局和页面时很重要的两个概念,主要用于数据个性化展示,下面,我们简单介绍一下SharePoint的页面布局和页面的个性化. 一. SharePoint页面模型概 ...

  7. 关于html页面布局

    之前做的一个网站,结果今天这几天测试发现在19寸屏幕和手机屏幕上页面布局全乱了,今天刚刚改好,发现还是自己经验不足,做个小总结. 一.div布局要固定宽高 当div不设计长宽高而是自动由内部控件”撑“ ...

  8. css页面布局

    写在前面: 页面布局整体上可以分为两类:固定宽度(一般固定960px):流式布局:将流式布局转换为固定布局很容易,只需要外围再包括一个div,为其设置宽度即可. html默认的布局方式是将每个块状标签 ...

  9. Bootstrap入门二:响应式页面布局

    Bootstrap 提供了一套响应式.移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列.它包含了易于使用的预定义类,还有强大的mixin 用于生成更具 ...

随机推荐

  1. 不要再问我MVC、MVP、MVVM了

    网络上有很多类似的讨论.包括一些大v,比如 阮一峰:MVC,MVP 和 MVVM 的图示 廖雪峰:MVVM 司徒正美: 各自用一句话来概括MVC.MVP.MVVM的差异特点 ... 但是说的往往比较概 ...

  2. java动态代理——jvm指令集基本概念和方法字节码结构的进一步探究及proxy源码分析四

    前文地址 https://www.cnblogs.com/tera/p/13336627.html 本系列文章主要是博主在学习spring aop的过程中了解到其使用了java动态代理,本着究根问底的 ...

  3. java验证工具类(待验证)

    /** * <判断对象是否为null或者空> * * @param obj * 需要判断的对象 * @return 如果对象为null或者空则返回true */ public static ...

  4. GitLab 后台修改用户密码

    GitLab 后台修改用户密码 # 打开控制台 gitlab-rails console production # 找到用户,输入密码,确认密码,保存 user = User.find_by(user ...

  5. AI顶会

    自己如何学习CV paper with code(每周) 基石方向 1.image classification 这个肯定要关注,这个往往都是backbone https://paperswithco ...

  6. NLP Github

    作者:cstghitpku链接:https://zhuanlan.zhihu.com/p/51279338来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 1.分词 Wo ...

  7. C# ASP 分析器错误信息: 无法识别的属性“targetFramework”。请注意属性名称区分大小写。

    在本地运行的应用,部署到服务器上出现错误.原因是web.config 中:<compilation debug="true" targetFramework="4. ...

  8. Django-Model模型Field选项中null和blank的区别

    - Option-**blank**设置为True时代表填写表单的时候可以为空,即在save()执行时此字段可以没有,如果字段没有就在数据库上存储一个空字符串: - Option-**null**设置 ...

  9. Vue <script></script>区域使用filter过滤器

    Vue中过滤器(filter)的功能高度提取,便于使用,前端小伙伴们使用的频率很高.但大多数都是在模板区域来使用. 如果要在脚本区域, 也就是来使用已经定义好过滤器功能,该如何去做呢? 难道需要在ut ...

  10. 【面经】超硬核面经,已拿蚂蚁金服Offer!!

    写在前面 很多小伙伴都反馈说,现在的工作不好找呀,也不敢跳槽,在原来的岗位上也是战战兢兢!其实,究其根本原因,还是自己技术不过关,如果你技术真的很硬核,怕啥?想去哪去哪呗!这不,我的一个读者去面试了蚂 ...