关于rem的计算顺序
/*响应式字体*/
/*
* 字体响应式
* 屏幕>640px时,html字体大小
* 屏幕<640px时,html字体根据屏幕做出相应
* */
(function(doc,win){
var docEl = doc.documentElement,
resizeEvt = "orientationchange" in window ? "orientationchange" : "resize",
recalc = function(){
var clientWidth = docEl.clientWidth;
if(!clientWidth) return ;
if(clientWidth>=1024){
docEl.style.fontSize = "100px";
}else if(768<clientWidth<1024){
docEl.style.fontSize = 100* (clientWidth / 1024) + "px"
}else if(clientWidth<768){
docEl.style.fontSize = 100* (clientWidth / 768) + "px"
}
};
if(!doc.addEventListener) return ;
win.addEventListener(resizeEvt,recalc,false);
doc.addEventListener("DOMContentLoaded",recalc,false);
})(document,window);
这段代码是根据屏幕大小计算字体的值也可以用来计算宽高,但是问题是页面一加载的时候 页面上的图片很明显的就是先变小 然后再正常,调试过是因为页面加载后再计算rem值导致的,如何解决呢?我想到的方法是页面没加载完不显示,完全加载完在显示 不知道有没有用?也不知道怎么实现呢?????
关于rem的计算顺序的更多相关文章
- c语言中printf()函数中的参数计算顺序
今天看到了一个关于printf()函数计算顺序的问题,首先看一个例子: #include<stdio.h> int main() { printf("%d---%d---%d&q ...
- printf函数对参数的计算顺序
没想到啊,没想到: printf函数对参数的计算顺序是从右往左的! 我不禁想问一句,这么坑爹的事情,书里居然没有写过.还是我看书不仔细,没有找到?(回头,在自己翻翻那本c语言编程) 于是下面的程序结果 ...
- C/C++知识要点4——printf函数以及cout的计算顺序
printf函数的计算顺序:先从右到左压栈,然后从左到右出栈. 例程: #include"stdio.h" int main() { int arr[] = { 1, 2, 3, ...
- rem怎么计算
px:相对长度单位.像素px是相对于显示器屏幕分辨率而言的 em:相对单位,继承父节点(层层继承,传递)基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px ...
- Python C3 算法 手动计算顺序
Python C3 算法 手动计算顺序 手动计算类继承C3算法原则: 以所求类的直接子类的数目分成相应部分 按照从左往右的顺序依次写出继承关系 继承关系第一个第一位,在所有后面关系都是第一个出现的 ...
- REM布局计算,移动端,pc端有兼容性)
rem布局计算(移动端,pc端有兼容性) <!DOCTYPE html> <html> <head lang="en"> <script& ...
- 有关C/C++中,表达式计算顺序的问题,以及表达式内部变量“副作用”问题(转)
经常可以在一些讨论组里看到下面的提问:“谁知道下面C语句给n赋什么值?”m = 1; n = m+++m++;最近有位不相识的朋友发email给我,问为什么在某个C++系统里,下面表达式打印出两个4, ...
- C/C++多参数函数参数的计算顺序与压栈顺序
一.前言 今天在看Thinking in C++这本书时,书中的一个例子引起了我的注意,具体是使用了下面这句 单看这条语句的语义会发现仅仅是使用一个简单的string的substr函数将所得子串pus ...
- 这次我好像才真的明白了CSS Rem字体计算的原理
背景 如何按照设计稿中标注的尺寸,直接写页面的样式,不再需要px2rem这样的工具或者人工转换 ? 只要你明白了rem的计算原理,这个问题的答案超级简单. 根字体大小计算核心原理 设备的根字体大小 * ...
随机推荐
- C#编写WIN32系统托盘程序
基本功能概述: 程序运行后驻留系统托盘,左键呼出,右键退出.后续可加右键菜单. 注册系统案件WIN+F10,呼出程序. 重写系统消息,最小化和关闭按钮隐藏程序 using System; using ...
- 在树莓派2代B型/3代 上安装Fedora23 - Installing Fedora 23 on Raspberry Pi 2 model B or Raspberry Pi 3
本文主要用于记录安装过程,以便日后查阅回顾. 之前在自己的树莓派上运行的一直是通过NOOB安装的Raspbian,但是本人平时更喜欢用Fedora作为开发和使用环境,而且Raspbian上的软件包通常 ...
- springmvc 用拦截器+token防止重复提交
一,原理: 1,在进入到提交页面时,使用拦截器拦截在进入此方法前,生成一个token,放到session中, @RequestMapping(value = "/{id}/details&q ...
- I/O系统 (输入/输出)
I/O系统 1:流: (1)判断到底是输入,还是输出:永远站在程序的立场上: (2)判断传递的到底是字节还是字符,从而决定管道的粗细: 字节管道可以传递所有数据,字符管道专门用来传递文本数据(1个字符 ...
- php-fpm 在centos 7下的安装配置
安装php: sudo yum install php php-fpm php-mysql php-mbstring php-mcrypt php-sockets php-curl php-commo ...
- c#全局鼠标事件以及鼠标事件模拟
最近在编写Max插件时,其主容器FlowLayoutPanel由于隐藏了滚动条,要实现按住鼠标中键上下拖动的功能,因此尝试了全局鼠标事件.以及鼠标勾子,可惜由于Max不争气?都未能实现,于是代码报废, ...
- 使用Fluent配置表关系
转载MS官方文档:https://msdn.microsoft.com/zh-cn/data/jj591620 Configuring Relationships with the Fluent AP ...
- Vuejs使用笔记 --- 框架
这两天学了vuejs的模板,于此纪录一下. 这是整个大文件夹的配置,现在我们看到的所有文件都不需要去管,说要关注也只需要关注“index.html” "index.html"里面是 ...
- STL迭代器之一:偏特化
在stl的算法中运用容器的迭代器时,很可能经常会用到迭代器相应型别(例如迭代器所指物的型别),假设算法中有必要声明一个变量,以"迭代器所指对象的型别"为类型,如何是好,例如我们写一 ...
- mssql分页存储过程
本文转自百度文库http://wenku.baidu.com/view/8f6ec149fe4733687e21aa72.html 必须有主键 原代码 Codeuse users go if exis ...