rem的js
html {
font-size : 20px;
}
@media only screen and (min-width: 401px){
html {
font-size: 25px !important;
}
}
@media only screen and (min-width: 428px){
html {
font-size: 26.75px !important;
}
}
@media only screen and (min-width: 481px){
html {
font-size: 30px !important;
}
}
@media only screen and (min-width: 569px){
html {
font-size: 35px !important;
}
}
@media only screen and (min-width: 641px){
html {
font-size: 40px !important;
}
}
;(function (doc, win, undefined) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in win? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (clientWidth === undefined) return;
docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
};
if (doc.addEventListener === undefined) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false)
})(document, window);
rem的js的更多相关文章
- 彻底搞好rem 与js的监控
什么是rem 在我看来,rem就是1rem单位就等于html节点fontsize的像素值.所以改变html节点的fontsize是最为关键的一步.根据手机宽度改变相对大小就可以实现自适应了,就不用什么 ...
- rem自适应js
Rem自适应js---flexible.min.js 网上看到很多移动端适配的各种方法,由于原来工作中对rem的疏忽,所以决定重新学习rem~ 由于移动端特殊性,本文讲的是如何使用rem实现自适应 ...
- rem适配布局(rem+less+媒体查询 和 rem+flexible.js)
1. rem 基础 rem 是一个相对单位,类似于 em ,em 是父元素字体大小. em 是相对于父元素 的字体大小来说的 rem 是相对于 html 元素 字体大小来说的 rem 优点 就是可以 ...
- 动态计算rem的js代码
以最小1024尺寸为例: function rem() { var htmlEle = document.documentElement; var winWidth = htmlEle.clientW ...
- rem布局js实现
(function(designWidth, maxWidth) { var doc = document, win = window; var docEl = doc.documentElement ...
- 移动端rem布局 js
// rem布局适配 (function(doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in ...
- Web移动前端开发-——rem+less+媒体查询,rem+flexble.js+媒体查询
实际开发搞搞起来!!!! rem适配方案 媒体查询+rem+less 基础知识铺垫 第一步,我们需要拿到设计稿,安装设计稿的要求来设置一个合适的html字体大小. 第二步,计算元素大小的取值 页面re ...
- rem布局js设置,设置网页文档参考字体闭包函数
(function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? ...
- rem 响应 js函数
size();window.onresize = function(){ size();}function size(){ var htnl_o=document.getElementsByTagNa ...
随机推荐
- JQuery速成大法
什么是JQuery呢,很多都是只闻其名. jQuery是一个快速.简洁的JavaScript框架,是一个优秀的JavaScript代码库.jQuery设计的宗旨是"write Less,Do ...
- CSS vertical-align属性
之前也经常用到vertical-align进行垂直居中对齐,突然发现其中的一些属性值根本就没使用过,也不清楚效果,将今天的研究成果记录下. vertical-align 属性 下表是w3c上列举的属性 ...
- 学好php可以做的事情真多!
学好php能做什么?其实学好php能做的事情很多! 一. 学好php可以就业 1:大中小公司通吃. 现在几乎所有有前途的公司都会在互联网上安家.只要在网上安家,就需要找这些方面的技术人员,而且很多公司 ...
- Spring+SpringMvc+Mybatis 框架的搭建(二)
4.4 mybatis-config.xml 这部分可以配置也可以不配置. <?xml version="1.0" encoding="UTF-8" ?& ...
- Quartz (一)
1 核心接口 1.1 Scheduler---核心调度器 1.2 Job---任务 1.3 JobDetail---任务描述 1.4 Trigger---触发器 2 触发器 Tigger(CornTr ...
- GBDT与LR融合提升广告点击率预估模型
1GBDT和LR融合 LR模型是线性的,处理能力有限,所以要想处理大规模问题,需要大量人力进行特征工程,组合相似的特征,例如user和Ad维度的特征进行组合. GDBT天然适合做特 ...
- H5 canvas圆形的时钟
今天用H5中的canvas标签做一个时钟,H5中有很多好用的新增标签,真的很不错. 1.canvas标签介绍 <canvas> 标签定义图形,比如图表和其他图像,你必须使用脚本来绘制图形. ...
- JS第二弹:用Jquery组装html标签,输出到页面
用Ajax从服务端获取数据,遍历到表格中(其实将表格替换了),中间发现不能为新增的元素绑定事件,原来是没有将其作为JQ对象
- 设计一个神经网络记住Or运算(日志一)
由于公式书写太过麻烦,所以上传设计的手稿过程,为如下:
- HDU4686——Arc of Dream矩阵快速幂
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=4686 题目大意: 已知a0=A0, ai=Ax*ai-1+Ay; b0=B0, bi=Bx*bi-1 ...