<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script>
　　　　<!--获取像素比：window.devicePixelRatio
　　　　1 / 像素 = 缩放的比例-->
 　　var initScale = 1 / window.devicePixelRatio; document.write('<meta name="viewport" content="width=device-width,user-scalable=no，initial-scale='+ initScale +',minimum-scale='+ initScale +',maximum-scale='+ initScale +'">'); 
　　var initWidth = window.document.documentElement.clientWidth; document.getElementsByTagName('html')[0].style.fontSize = initWidth / 50 + 'px';
    </script>

    <style>

        body{

            margin: 0;

            overflow: hidden;

        }

        .box{

            width: 10rem;

            height: 10rem;

            margin: 0.33333rem;

            background: pink;

            float: left;

            font-size: 30px;

        }

    </style>

</head>

<body>

    <div class="box">box1</div>

    <div class="box">box2</div>

    <div class="box">box3</div>

    <div class="box">box4</div>

    <div class="box">box5</div>

    <div class="box">box6</div>

</body>

</html>

动态设置缩放比例和html字体大小的更多相关文章

  1. IDEA设置Ctrl+滚轮调整字体大小

    IDEA设置Ctrl+滚轮调整字体大小(转载)   按Ctrl+Shift+A,出现搜索框 输入mouse: 点击打开这个设置:勾选 点击ok,之后就可以通过Ctrl+滚轮 调整字体大小了.

  2. WebStorm设置编辑器中的字体大小

    启动webStorm之后,点击“FIle"菜单,选择其下的”Settings" 2.在左侧的菜单中选择“Editor/Colors & Fonts/Font 在右侧Sche ...

  3. Eclipse设置：背景与字体大小和xml文件中字体大小调整

    Eclipse中代码编辑背景颜色修改:代码编辑界面默认颜色为白色.对于长期使用电脑编程的人来说,白色很刺激我们的眼睛,所以改变workspace的背景色,可以使眼睛舒服一些.设置方法如下:1.打开wi ...

  4. IDEA或Webstorm设置Ctrl+滚轮调整字体大小

    按Ctrl+Shift+A,出现搜索框 输入mouse: 点击打开这个设置:勾选 点击ok,之后就可以通过Ctrl+滚轮 调整字体大小了.

  5. Eclipse中设置背景颜色与字体大小和xml文件中字体大小调整

    Eclipse中代码编辑背景颜色修改: 代码编辑界面默认颜色为白色.对于长期使用电脑编程的人来说,白色很刺激我们的眼睛,所以改变workspace的背景色,可以使眼睛舒服一些.设置方法如下: 1.打开 ...

  6. Jupyter Notebook 设置黑色背景主题、字体大小、代码自动补全

    1.背景主题.字体大小设置 安装Jupyter主题: pip install jupyterthemes 然后,更新Jupyter主题: pip install --upgrade jupyterth ...

  7. Eclipse设置：背景与字体大小、xml文件中字体大小调整和自动提示 SVN插件安装

    Eclipse中代码编辑背景颜色修改: 代码编辑界面默认颜色为白色.对于长期使用电脑编程的人来说,白色很刺激我们的眼睛,所以改变workspace的背景色,可以使眼睛舒服一些.设置方法如下: 1.打开 ...

  8. （备忘）Eclipse设置：背景与字体大小和xml文件中字体大小调整

    Eclipse中代码编辑背景颜色修改: 1.打开window / Preference,弹出Preference面板  2.展开General标签,选中Editors选项,展开.  3.选中 Text ...

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

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

随机推荐

  1. Zabbix 监控服务器

    Zabbix 操作系统 :CentOS7.5 两台服务器: server端:192.168.206.6 client 端: 192.168.206.3 zabbix : 4.0 mariiadb : ...

  2. DOM 事件类

    DOM事件的级别: DOM级别一共可以分4个级别:DOM0级.DOM1级. DOM2级 .DOM3级.而DOM事件级别分为3个级别:DOM0级事件处理.DOM2级事件处理.DOM3级事件处理 1. D ...

  3. HDU 1269 迷宫城堡 最大强连通图题解

    寻找一个迷宫是否是仅仅有一个最大强连通图. 使用Tarjan算法去求解,经典算法.必需要学习好,要自己创造出来是十分困难的了. 參考资料:https://www.byvoid.com/blog/scc ...

  4. [swift实战入门]手把手教你编写2048(一)

    苹果设备越来越普及,拿着个手机就想捣鼓点啥,于是乎就有了这个系列,会一步一步教大家学习swift编程,学会自己做一个自己的app,github地址:https://github.com/scarlet ...

  5. NSArray和NSMutableArray的常用方法 (转)

    NSArray和NSMutableArray的常用方法 (转) (2013-09-06 15:13:46) 标签: it 分类: ios编程 初始化方法:   1.init返回一个空数组    2.i ...

  6. luogu2540 斗地主增强版

    题目大意 给你一副手牌,没有飞机带翅膀,按斗地主的规则,求将所有牌打出的最少次数. 题解 先不考虑顺子 我们已经知道花色对牌没有影响,那么如果不考虑顺子,每个牌具体是什么数字我们也用不着知道,我们关心 ...

  7. expandableListview的默认箭头箭头怎样移到右边

    1 . ExpandableListView布局:<ExpandableListView    android:id="@+id/bbs_category_expandable_lis ...

  8. 开源框架 KJFrameForAndroid

    一个Android的快速开发工具包,使用它你可以轻松实现网络请求.插件化开发.图片加载等功能.KJFrameForAndroid的设计思想是通过封装Android原生SDK中复杂的复杂操作而达到简化A ...

  9. [Codeforces 140C] New Year Snowmen

    [题目链接] https://codeforces.com/problemset/problem/140/C [算法] 显然 , 我们每次应优先考虑数量多的雪球 将雪球个数加入堆中 , 每次取出数量前 ...

  10. POJ1912 A highway and the seven dwarfs (判断凸包与直线相交 logn)

    POJ1912 给定n个点 和若干条直线,判断对于一条直线,是否存在两个点在直线的两侧. 显然原命题等价于 凸包与直线是否相交. O(n)的算法是显而易见的 但是直线数量太多 就会复杂到O(n^2)由 ...