<html>

<head>

<meta charset="utf-8">

<script>

　　console.log(window.devicePixelRatio);

　　var iScale = 1;

　　iScale = iScale/window.devicePixelRatio;

　　document.write('<meta name="viewport" content="width=device-width,user-scable=no,initial-scale=' + iScale + ',minimum-scale=' + iScale + ',maximum-scale=' + iScale + '"/>');

　　//console.log(document.documentElement.clientWidth);

　　var iWidth = document.documentElement.clientWidth/16;

　　document.getElementsByTagName('html')[0].style.fontSize = iWidth + 'px';

</script>

</head>

</html>

使用js rem动态改变字体大小，自适应的更多相关文章

  1. rem布局和使用js rem动态改变字体大小，自适应

    解决rem文字动态改变字体大小: <script> console.log(window.devicePixelRatio); var iScale = 1; iScale = iScal ...

  2. 响应式网页：用em,rem设置网页字体大小自适应

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

  3. 改变字体大小实现自适应之js方案A

    一.元素大小有两种写法 1.写结果:设计师给的移动端页面sketch设计稿一般是750px宽度,在sublime编辑器里,设置cssrem或rem-unit插件为56px的字体大小.做页面时,设计稿是 ...

  4. javascript实现一行文字随不同设备自适应改变字体大小至字数完全展示

    产品提了一个小需求,希望一行能展示用户输入的所有文字,因为最多限制为25字符,但是如果夹杂英文/韩文/日文等,即使字符数是一样的,但是展示的长度不一样,则有些title标题会被截断. 效果如图 前提是 ...

  5. pycharm设置用滑轮改变字体大小

    在电脑第一次安装pycharm之后,发现每次调整代码界面的字体,总是需要到setting里面调整,这样非常不方便,特别是对于代码量很多的时候,我们有时候需要把目光聚焦到某一句代码,这个时候就需要放大, ...

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

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

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

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

  8. js控制手机端字体大小rem

    //得到手机屏幕的宽度 let htmlWidth = document.documentElement.clientWidth || document.body.clientWidth; if(ht ...

  9. 字体大小自适应纯css解决方案

    viewpoint css3提供了一些与当前viewpoint相关的元素,vw,vh,vim等. “viewpoint” = window size vw = 1% of viewport width ...

随机推荐

  1. SpringCloud(三)学习笔记之Ribbon

    spring Cloud Ribbon 是一个客户端的负载均衡器,它提供对大量的HTTP和TCP客户端的访问控制. 客户端负载均衡即是当浏览器向后台发出请求的时候,客户端会向 Eureka Serve ...

  2. Youtube推荐算法的前世今生

    第一阶段,基于User-Video图游历算法,2008年[1]. 在这个阶段,YouTube认为应该给用户推荐曾经观看过视频的同类视频,或者说拥有同一标签的视频.然而此时,YouTube的视频已是数千 ...

  3. 掌握游戏开发中类Message、Handle

    1.   实验目的 1. 自主地设计图形界面 2. 掌握消息类Message的应用 3. 掌握消息处理类Handle的应用 4. 掌握子线程中中更新UI界面的方法 2.  实验内容 1. 在主界面设置 ...

  4. ajax轮询思路

    以我个人理解 ,ajax短轮询就是用定时器,定时请求数据库,然后把有用的数据做处理 ajax长轮询恩 就是在 ajax回调函数,继续调用ajax请求

  5. [Inno Setup] 开机自启动

    [icons] Name: "{userstartup}\My Program"; Filename: "{app}\MyProg.exe"; Tasks:St ...

  6. 基于java的OpenCV安装和配置

    目录 OpenCV简介 OpenCV下载安装 eclipse里引用jar包和配置 OpenCV简介 OpenCV是一个基于BSD许可(开源)发行的跨平台计算机视觉库,可以运行在Linux.Window ...

  7. 小白的MyBatis逆向工程

    MyBatis逆向工程   MyBatis逆向工程,简称MBG.是一个专门为MyBatis框架使用者定制的代码生成器. 可以快速的根据数据库表生成对应的映射文件,接口,以及Bean类对象. 在Myba ...

  8. HTML后台管理页面布局

    设计网页,让网页好看:网上找模板 搜 HTML模板 BootStrap 一.内容回顾: HTML 一大堆的标签:块级.行内 CSS position background text-align mar ...

  9. Neditor 2.1.16 发布，修复缩放图片问题

    开发四年只会写业务代码,分布式高并发都不会还做程序员?   BUG 修复 修复缩放图片时,鼠标mouseUp后图片还是在缩放 by @ShinyHwong Demo:  https://demo.ne ...

  10. Mockjs+Ajax实践

    需要完成的工作:利用mock js随机生成数据,通过ajax请求,获取这些数据并展示在网页中. 一 mock js随机生成数据 官方文档中,Mock.mock( ),可以说是mock的精髓所在. Mo ...