h5整体页面布局
只要在每个页面加入这段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整体页面布局的更多相关文章
- h5单页面布局
前段时间做了一个PC端单页面应用 GitHub因为项目开始的比较仓促,加上本人前端经验特别少,虽然项目大体完成了,但是页面布局确成立它的硬伤...为了填补心里落差,专门做了一个h5的单页面布局,代码很 ...
- app开发,H5+CSS3页面布局小tips
1.inline-block使用后带来的间隔影响 2.竖线的处理 3.ssh公匙 4.星星组件的巧妙用法 5.api.js的$api对象与 安卓原生引擎的api对象,均相当于jQuery的$对象 6. ...
- CSS3与页面布局学习总结(四)——页面布局大全
一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...
- CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化
一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...
- CSS3与页面布局学习笔记(八)——浏览器兼容性问题与前端性能优化方案
一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...
- SharePoint 2013 入门教程之创建页面布局及页面
在SharePoint的使用过程中,页面布局和页面时很重要的两个概念,主要用于数据个性化展示,下面,我们简单介绍一下SharePoint的页面布局和页面的个性化. 一. SharePoint页面模型概 ...
- 关于html页面布局
之前做的一个网站,结果今天这几天测试发现在19寸屏幕和手机屏幕上页面布局全乱了,今天刚刚改好,发现还是自己经验不足,做个小总结. 一.div布局要固定宽高 当div不设计长宽高而是自动由内部控件”撑“ ...
- css页面布局
写在前面: 页面布局整体上可以分为两类:固定宽度(一般固定960px):流式布局:将流式布局转换为固定布局很容易,只需要外围再包括一个div,为其设置宽度即可. html默认的布局方式是将每个块状标签 ...
- Bootstrap入门二:响应式页面布局
Bootstrap 提供了一套响应式.移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列.它包含了易于使用的预定义类,还有强大的mixin 用于生成更具 ...
随机推荐
- Docker学习日记-安装Docker
Docker是什么: 简单理解就是基于go语言开发的开源的应用容器引擎. 对进程进行封装隔离,属于操作系统层面的虚拟化技术. Docker的优势: 1.更高效的利用系统资源 2.更快速的启动时间 3. ...
- 笨办法学python3练习代码11-12:print()
ex11.py print("How old are you? ",end = " ") #加入end = " ",则函数不再自动换行 ag ...
- 2020-05-25:MQ应用场景、Kafka和rabbit区别?kafka为什么支撑高并发? 来自
福哥答案2020-05-25: 应用场景:解耦.异步.削峰.区别如下:特性 ActiveMQ RabbitMQ RocketMQ Kafka单机吞吐量 万级,比 RocketMQ.Kafka 低一个数 ...
- 浅谈python深复制与浅复制区别
话不多说,看代码
- Enumerable 下又有新的扩展方法啦,快来一起一睹为快吧
一:背景 1. 讲故事 前段时间将公司的一个项目从 4.5 升级到了 framework 4.8 ,编码的时候发现 Enumerable 中多了三个扩展方法: Append, Prepend, ToH ...
- 数据恢复----重组raid5解析
重组Raid5 第一步:判断RAID5条带大小 利用winhex同时打开6个物理镜像每块成员盘中的$MFT文件记录(16进制搜索“46494c45”),并且保证找到的文件记录在每块物理盘的同一扇区(在 ...
- JAVA 读取excel文件成List<Entity>
package com.fsinfo.common.utils; import com.fsinfo.modules.enterprise.entity.EnterpriseRecordEntity; ...
- DDD与Repository
Repository已经不是什么新鲜概念了.DDD模型自2004年提出,发展至今已经16年了.但是不少企业却无法实施,其原因也很简单:DDD是基于需求的,而很多并不理解需求:DDD是容易实现的,而很多 ...
- java基础-04:标识符与关键字
在Java中,标识符是代表你对程序中某个方法或变量赋予的一个名称,而这个名称不能是关键字 关键字:
- 阿里云鼠标垫,云中谁寄锦书来,阿里云定制GIT指令集鼠标垫
活动地址 云中谁寄锦书来 活动时间 2020.8.19-8.28 奖品 必得,每日200份,共2000份 参考答案 tips:单选选择以上都是,多选就是全选 云效DevOps包含哪些产品- ABCDE ...