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 ...
随机推荐
- hdu1711kmp
Given two sequences of numbers : a11, a22, ...... , aNN, and b11, b22, ...... , bMM (1 <= M <= ...
- java web 简单的登录注册
--sql文件 create database studentgouse studentgocreate table stuinfo(--stuid int primary key identity( ...
- arcgis属性选取like用法
查询对象为ArcInfo coverage,shapefile, INFO table,dBASE table,ArcSDE data,ArcIMS 要素类,或者 ArcIMS image servi ...
- C#之lambda表达式
从C#3.0开始,可以使用lambda表达式把实现代码赋予委托.lambda表达式与委托(http://www.cnblogs.com/afei-24/p/6762442.html)直接相关.当参数是 ...
- 重庆/北京/江苏KS/快乐时时/七星/福运来菠菜电商开奖修复APP网站SSC网站程序开发php
网站制作是指使用标识语言(markup language),通过一系列设计.建模.和执行的过程将电子格式的信息通过互联网传输,最终以图形用户界面(GUI)的形式被用户所浏览.简单来说,网页设计的目的就 ...
- JWebFileTrans(JDownload): 一款可以从网络上下载文件的小程序(三),多线程断点下载
一 前言 本篇博客是<JWebFileTrans(JDownload):一款可以从网络上下载文件的小程序>系列博客的第三篇,本篇博客的内容主要是在前两篇的基础上增加多线程的功能.简言之,本 ...
- ng-option
select 是 AngularJS 预设的一组directive.下面是其官网api doc给出的用法:AngularJS:select 大意是,select中的ngOption可以采用和ngRep ...
- 学java网络编程的心得体会
网络编程简单思路 一.发送端1创建udp服务,通过DatagramSocket对象;2确定数据,封装成包DatagramPacket(byte[] buf, int length, InetAddre ...
- sublime比较好用的插件
emmet, markdown preview, package Control, SFTP, Anaconda
- 029 hibernate抓取策略
实例A引用实例B,B如果是代理的话(比如多对一关联中):如果遍历A的查询结果集(假设有10条记录),在遍历A的时候,访问B变量,将会导致n次查询语句的发出!这个时候,如果在B一端的class上配置ba ...