<!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. 使用Docker部署Gitlab

    由于公司的代码server已使用Gitosis搭建,但由于用户和权限管理太麻烦. 如今想在原有server上再搭建Gitlab,使用Gitlab官方方法直接安装. 会导致与Gitosis冲突,使得Gi ...

  2. SGU 261. Discrete Roots （N次剩余）

    N次剩余 题目:http://acm.sgu.ru/problem.php? contest=0&problem=261 题意:给定n,a,p 求出x^n ≡ a(mod p)在模p意义下的全 ...

  3. NSoup解析处理Html

    以前在做网页静态生成的时候,使用正则表达式分析提取网页链接.最近搜索了解到java有个Jsoup解析网页,对应.net有个nsoup.处理网页非常好用. Document doc = NSoupCli ...

  4. 经典的printk 写法

    经典的printk 写法: printk("[lynn--%s@%d]: addr:0x%x  \n",__func__,__LINE__,obj->client->a ...

  5. MessageBox.Show

    MessageBox.Show()共有21中重载方法.现将其常见用法总结如下: .MessageBox.Show("Hello~~~~"); 最简单的,只显示提示信息. .Mess ...

  6. 4.9 Parser Generators

    4.9 Parser Generators This section shows how a parser generator can be used to facilitate the constr ...

  7. bzoj1898 [Zjoi2005]Swamp 沼泽鳄鱼——矩阵快速幂

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1898 求到达方案数...还是矩阵快速幂: 能够到达就把邻接矩阵那里赋成1,有鳄鱼的地方从各处 ...

  8. IIs+php 最精简的环境配置

    一,安装IIS 1,打开控制面板->程序和功能->打开或关闭windows功能->Internet 信息服务 1>选 中web管理工具 2>选 中万维网服务 1>应 ...

  9. java笔记线程方式1睡眠

    public class ThreadSleepDemo { public static void main(String[] args) { ThreadSleep ts1 = new Thread ...

  10. bzoj 2097: [Usaco2010 Dec]Exercise 奶牛健美操【二分+树形dp】

    二分答案,然后dp判断是否合法 具体方法是设f[u]为u点到其子树中的最长链,每次把所有儿子的f值取出来排序,如果某两条能组合出大于mid的链就断掉f较大的一条 a是全局数组!!所以要先dfs完子树才 ...