手机端布局,rem布局动态获取根字体大小。

以下代码:

//rem布局动态获取根字体大小
function remDynamicLayout(){
var $windowWidth = $(window).width();
function htmlFontZize(){
$windowWidth = $(window).width();
if ($windowWidth > 640) {
$windowWidth = 640; //限定最大宽度为640
}
$("html").css("font-size", (100 / 414) * $windowWidth + "px");
}
setTimeout(function () {
htmlFontZize();
}, 100);
$(window).resize(function () {
htmlFontZize();
});
}
remDynamicLayout();

手机端布局,rem布局动态获取根字体大小的更多相关文章

  1. 移动端使用rem时候动态设置html字体大小

      !(function(doc, win) { var docEle = doc.documentElement, evt = "onorientationchange" in ...

  2. rem布局,在用户调整手机字体大小/用户调整浏览器字体大小后,布局错乱问题

    一.用户调整浏览器字体大小,影响的是从浏览器打开的web页. 浏览器设置字体大小,影响浏览器打开的页面.通过js可控制用户修改字体大小,使页面不受影响. (function(doc, win) { / ...

  3. 动态设置html根字体大小(随着设备屏幕的大小而变化,从而实现响应式)

    代码如下:如果设置了根字体大小,font-size必须是rem var html =document.querySelector('html'); html.style.fontSize = docu ...

  4. rem手机端页面自适应布局(待修正下一篇完美布局)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 手机端页面rem自适应脚本

    什么是rem 参照 web app变革之rem 在我看来,rem就是1rem单位就等于html节点fontsize的像素值.所以改变html节点的fontsize是最为关键的一步.根据手机宽度改变相对 ...

  6. 手机端使用rem适配

    最近一直在做手机端的东西,各种型号的手机适配很是无解.经过同事及百度找到了这么一个方法 html font-size默认100px 将rem进行换算1px==0.01rem; 页面在各个手机适配个别会 ...

  7. html根标签设置font-size为100px,使用rem,body没设置字体大小

    今天使用了rem来写样式,前提是要给html设置font-size:100px;这样在计算比例时相对方便点:结果在将一个span标签设置为display:inline-block;时发现span不能能 ...

  8. [转]响应式网页设计:rem、em设置网页字体大小自适应

    本文转自:http://www.cnblogs.com/aimyfly/archive/2013/07/19/3200742.html 「rem」是指根元素(root element,html)的字体 ...

  9. 响应式网页设计:rem、em设置网页字体大小自适应

    「rem」是指根元素(root element,html)的字体大小,好开心的是,从遥远的 IE6 到版本帝 Chrome 他们都约好了,根元素默认的 font-size 都是 16px.这样一个新的 ...

随机推荐

  1. 2018.09.25 poj3070 Fibonacci(矩阵快速幂)

    传送门 矩阵快速幂板题,写一道来练练手. 这一次在poj做题总算没忘了改万能库. 代码: #include<iostream> #include<cstdio> #define ...

  2. 2018.09.17 bzoj1260: [CQOI2007]涂色paint(区间dp)

    传送门 区间dp简单题啊. 很显然用f[l][r]f[l][r]f[l][r]表示把区间[l,r][l,r][l,r]按要求染好的代价. 这样可以O(n)O(n)O(n)枚举断点转移了啊. 显然如果断 ...

  3. maven随笔

    1.在我们项目顶层的POM文件中,我们会看到dependencyManagement元素.通过它元素来管理jar包的版本,让子项目中引用一个依赖而不用显示的列出版本号.Maven会沿着父子层次向上走, ...

  4. IoC的基本概念

    一.什么是IOC ioc是一个英文缩写,英文全称是 Inversion of Control,翻译过来是“控制反转”.理解好Ioc的关键是要明确“谁控制谁,控制了什么,为何是反转,哪些方面反转了” 谁 ...

  5. UVaLive 3645 Objective: Berlin (最大流)

    题意:有n个城市,m条航班.已知每条航班的起点和终点,还有每条航班的载客量.出发时间.到达时间.并且要求在任何一个城市(起点.终点除外)都至少要有30分钟的中转时间,求起点到终点的最大客流量. 析:把 ...

  6. springMVC学习(注解实现依赖注入)

    原文:http://blog.csdn.net/mockingbirds/article/details/45399691 上一篇博客,学习了spring的依赖注入,即利用spring容器来为类中的属 ...

  7. 被“1”和“l”给坑了

    由于输入法的原因,导致小写的英文字母“L”和阿拉伯数字“1”长得非常像,在写秘钥的时候很容易把看错.由于对方发秘钥的时候给的是图片,而且不太清晰,手动输入的时候把“1”写成“l”了,对了好几遍秘钥也没 ...

  8. (并查集 添加关系)How Many Answers Are Wrong --Hdu --3038

    链接: http://acm.hdu.edu.cn/showproblem.php?pid=3038 http://acm.hust.edu.cn/vjudge/contest/view.action ...

  9. [leetcode] 17. Merge Two Sorted Lists

    这个非常简单的题目,题目如下: Merge two sorted linked lists and return it as a new list. The new list should be ma ...

  10. Android SharedPreference

    在Android开发过程中,Android提供了SharedPreference共享首选项,它的用途就是,用于保存软件配置信息,APP使用过程中,需要用到的配置信息,例如:音量大小等: SharedP ...