zoukankan      html  css  js  c++  java
  • 移动页面缩放方法之(三)rem布局

    <!DOCTYPE HTML>
    <html lang="zh-cn">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/>
    <title>无标题文档</title>
    <style>
    *{
        padding:0;
        margin:0;    
    }
    body{
        background:#000;    
    }
    div{
        6.4rem;
        height:5rem;
        margin:0 auto;
        line-height:5rem;
        font-size:.3rem;
        text-align:center;
        color:#fff;
        background:red;    
    }
    </style>
    </head>
    
    <body>
    <div>我是测试的</div>
    <script>
    ;!function(top){
        var doc=top.document;
        top.SetSize=function(width){
            this.obj=doc.querySelector('html');
            this.width=width;
            this.fontSize=100;
            this.init().resize();
        };    
        SetSize.prototype={
            init:function(){
                this.scale=this.obj.clientWidth/this.width;
                this.obj.setAttribute("style","font-size:"+(this.scale*this.fontSize)+"px !important");
                return this;    
            },
            resize:function(){
                top.addEventListener('resize',this.init.bind(this),false);    
            }
        };
        SetSize.prototype.constructor=SetSize;
        doc.addEventListener('DOMContentLoaded',function(){
            new SetSize(640);
        },false);
    }(parent);
    </script>
    </body>
    </html>
  • 相关阅读:
    i春秋CTF-web-upload
    [转]SEP 11.x 迁移
    通过SEP禁用USB
    通过SEP屏蔽共享文件夹
    SEP图示
    离线更新SEPM服务器的病毒定义库
    SEPM安装完之后的一些细节之处
    Bloomberg SEP 12.x 迁移小记
    LiveUpdate Adminstrator配置手册
    Symantec更新服务器
  • 原文地址:https://www.cnblogs.com/tfbodys/p/5043443.html
Copyright © 2011-2022 走看看