1.根据屏幕大小动态设置字体rem

var docEl = document.documentElement,
//当设备的方向变化(设备横向持或纵向持)此事件被触发。绑定此事件时,
//注意现在当浏览器不支持orientationChange事件的时候我们绑定了resize 事件。
//总来的来就是监听当然窗口的变化,一旦有变化就需要重新设置根字体的值
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
//设置根字体大小
let maxWidth = 750
let cw = docEl.clientWidth>maxWidth ? maxWidth : docEl.clientWidth
docEl.style.fontSize = 10 * (cw / 320) + 'px';
}; //绑定浏览器缩放与加载时间
window.addEventListener(resizeEvt, recalc, false);
document.addEventListener('DOMContentLoaded', recalc, false);

根据屏幕大小动态设置字体rem的更多相关文章

  1. ALT+TAB切换时小图标的添加 界面透明 屏幕大小 竖行字体 进程信息

    一,ALT+TAB切换时小图标的添加 Dlg类中添加变量 protected: HICON m_hIcon; #define IDR_MAINFRAME 128 ICON IDR_MAINFRAME, ...

  2. Android获取屏幕大小和设置无标题栏

    android获取屏幕大小非常常用,例如写个程序,如果要做成通用性很强的程序,适用屏幕很强,一般布局的时候都是根据屏幕的长宽来定义的,所以我把这个总结一下,方便日后忘记的时候查阅.还有就是有时候写程序 ...

  3. Android开发之动态设置字体的样式和粗细

    字体设置通常有两种形式: 1:在xml中直接设置 android:textStyle="bold" android:typeface="sans" 2:用jav ...

  4. vue/cli 3.0 font-size随屏幕大小变化而变化 rem设置

    在安装cube-ui框架时 安装成功后在[E:\WWW\xxx\node_modules\vue-cli-plugin-cube-ui\generator\rem\index.js]修改remUnit ...

  5. Unity UI大小动态设置(Resize Unity UI RectTransform)

    我们在开发过程中发现,要调整Unity UI元素的大小,RectTransform提供了sizeDelta属性可以用来动态修改RectTransform的大小,但同时我们也google到另外一个修改R ...

  6. 网站图片列表动态显示、根据屏幕宽度动态设置DIV的CSS样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. pycharm动态设置字体放大缩小

    放大设置 File —> settings—> Keymap —>在搜寻框中输入:increase —> Increase Font Size(双击) —> 在弹出的对话 ...

  8. Android动态设置字体颜色

    步骤: 1.在values目录下的strings.xml文件中加入颜色:比方 <color name="ccc">#ccc</color> 2.假设你直接这 ...

  9. Android textView 动态设置代码字号大小,支持单位选项 dp,sp or px

    setTextSize(TypedValue.COMPLEX_UNIT_PX,22); //22像素 setTextSize(TypedValue.COMPLEX_UNIT_SP,22); //22S ...

随机推荐

  1. JS判断输入是否为整数的正则表达式

      1.正确表达式 "^\\d+$" //非负整数(正整数 + 0)"^[0-9]*[1-9][0-9]*$" //正整数"^((-\\d+)|(0+ ...

  2. 一看便知spring+quartz定时任务

    这是我经过网上收集然后加上自己的测试写的,以便大家使用 标配:已测 注意需要的包:(在已经配置spring 的情况下) quartz-all-1.6.jar        spring-context ...

  3. EXCLE使用中常用函数和公式

    1.查找重复项 IF(COUNTIF(A:A,A1)>1"重复""") 或者 IF(COUNTIF($A$1:$A$100,A1)=1,"&qu ...

  4. MVC程序中实体框架的Code First迁移和部署

    01. 启用迁移 [在控制台中,输入以下命令:]enable-migrations  //命令将在项目中创建一个迁移文件夹.同时文件夹中包含一个Configuration.cs文件,你可以编辑该文件来 ...

  5. python两种生成md5的方法

    一. 使用md5包 import md5 src = 'this is a md5 test.' m1 = md5.new() m1.update(src) print m1.hexdigest() ...

  6. PDO操作数据库

  7. php保留键随机打乱数组顺序

    最近遇到一个需求,把一个数组随机打乱顺序,我们可以用php的shuffle函数,但是这个函数会把数组的键清空建立新的键,那么我们若想保留键只需要利用shuffle函数再做一下处理就可以了.可以自定义一 ...

  8. s5pv210 cpu运行debian

    1.环境准备 sudo apt-get install binfmt-support qemu qemu-user-static debootstrap 2.获取debian根文件系统 2.1.cd ...

  9. Exception in thread "main" java.lang.ExceptionInInitializerError

    Exception in thread "main" java.lang.ExceptionInInitializerErrorCaused by: java.util.Missi ...

  10. Unity3D之随心所欲的获取对象

    ps 1 建立一个cube 建立一个scripts 2  scripts 赋给cube 3  在script里面直接  gameObject.SetActive (false); 就是操作当前脚本绑定 ...