<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--对viewport的设置的meta建议写在已有的meta标签(<meta charset="UTF-8">)之后-->
    <!--name="viewport":说明当前meta标签是用来设置viewport的属性的,
     这个属性只有在    移动端     才会有效-->
    <!--content="":进行viewport的设置
    width:设置viewport的宽度  device-width:获取当前设备的宽度
    initial-scale=1:设置初始缩放比例  当我们设置width=device-width,也达到了initial-scale=1的效果,得知其实 initial-scale = ideal viewport / layout viewport  意味着,如果initial-scale设置为1,相当于设置了两个viewport的宽度一致
    maximum-scale:设置最大的缩放比例
    minimum-scale:设置    默认状态    下最小的缩放比例-->
    <!--<meta name="viewport" content="width=device-width">-->
    <!--<meta name="viewport" content="initial-scale=1
    user-scalable:设置是否允许用户进行缩放yes/no">-->

    <!--兼容:在device-width和inital-scale
    不同的手机   和  不同系统版本   (手机品牌和型号太多了,指不定出什么幺蛾子)
    之间的识别情况不同,所以都得写上,不然适配会出现问题-->
    <!--<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,user-scalable=no">-->
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>Title</title>
    <style>
        body{
            padding: 0;
            margin: 0;
        }
        div{
            width: 100%;
            height: 200px;
            background-color: pink;

        }
    </style>
</head>
<body>
<div>移动页面最理想的状态是,避免滚动条且不被默认缩放处理,我们可以通过设置来进行控制,并改变浏览器默认的layout viewport的宽度。</div>
</body>
</html>
%px;background-color: pink;

}    </style></head><body><div>移动页面最理想的状态是,避免滚动条且不被默认缩放处理,我们可以通过设置来进行控制,并改变浏览器默认的layout viewport的宽度。</div></body></html>

移动web 的viewport设置注意事项的详细解释 六一快乐=-_-_的更多相关文章

  1. in文件注意事项及详细解释

    lammps做分子动力学模拟时,需要一个输入文件(input script),也就是in文件,以及关于体系的原子坐标之类的信息文件(data file)和势文件(potential file).lam ...

  2. in文件注意事项及详细解释(转载)

    转载自:https://www.cnblogs.com/sysu/p/10817315.html  和   https://www.cnblogs.com/panscience/p/4953940.h ...

  3. 开发环境中biztalk项目设置注意事项(转)

      适用版本:biztalk 2006 适用环境:开发测试环境 在开发过程中,在开发环境中,一定会是一个对项目不断的修改.编译.部署.测试,查看测试结果,发现有问题,然后回到开发环境再修改.编译.部署 ...

  4. Web APi之HttpClient注意事项以及建议

    Web APi之HttpClient注意事项以及建议 前言 之前对于用SelfHost来手动实现Web API的宿主模式,似乎不是太深入,所以本篇文章我们一起来讨论关于利用HttpClient来访问W ...

  5. 支持10W高并发请求的IIS Web服务器常用设置

    支持高并发的IIS Web服务器常用设置   适用的IIS版本:IIS 7.0, IIS 7.5, IIS 8.0 适用的Windows版本:Windows Server 2008, Windows ...

  6. Web开发中设置快捷键来增强用户体验

    从事对日外包一年多以来,发现日本的无论是WinForm项目还是Web项目都注重快捷键的使用,日本人操作的时候都喜欢用键盘而不是用鼠标去点,用他们的话来说"键盘永远比鼠标来的快",所 ...

  7. Asp.Net中的获取Web.config中设置的参数!(前后台的代码示例)

    一.Web.config中设置代码     <appSettings>         <add key="deleted" value="1" ...

  8. 此项目的默认Web访问模式设置为文件共享, 但是无法从路径(此为转贴)

    故障现象: 当你打开ASP.NET Web项目时,如果出现这样的错误提示:提示窗口标题: Web访问失败提示内容: 此项目的默认Web访问模式设置为文件共享, 但是无法从路径“...”打开“...”处 ...

  9. 浅谈meta viewport设置移动端自适应

    1.viewport 移动设备上的viewport是设备屏幕上用来显示网页的那部分区域,再具体一点就是浏览器上用来显示网页的那部分区域,但viewport又不局限于浏览器可视区域的大小,它可能比浏览器 ...

随机推荐

  1. 股神小D

    题目大意: 给定一棵树,每一条边有$L,R$两种权值,求有多少条路径满足$\max(L)\leq\min(R)$. 解法$1-$点分治$+$二维数点 统计树上的路径应首先想到点分治,我们很显然可以搜出 ...

  2. C#连接solr时提示 java内存异常 (jetty和tomcat哪个更High) java.lang.OutOfMemoryError

    C#连接solr时提示 java内存异常   java.lang.OutOfMemoryError 时间:20180130 09:51:13.329,消息:异常消息<?xml version=& ...

  3. ACM学习历程—Hihocoder 1290 Demo Day(动态规划)

    http://hihocoder.com/problemset/problem/1290 这题是这次微软笔试的第三题,过的人比第一题少一点,这题一眼看过去就是动态规划,不过转移方程貌似不是很简单,调试 ...

  4. [转]为什么GOF的23种设计模式里面没有MVC?

    GoF (Gang of Four,四人组, <Design Patterns: Elements of Reusable Object-Oriented Software>/<设计 ...

  5. BZOJ1707:[Usaco2007 Nov]tanning分配防晒霜

    我对贪心的理解:https://www.cnblogs.com/AKMer/p/9776293.html 题目传送门:https://www.lydsy.com/JudgeOnline/problem ...

  6. 【转】 Pro Android学习笔记(五五):调试和分析(3):adb命令、模拟器控制台和StrictMode

    目录(?)[-] adb命令 模拟器Console StrictMode adb命令 我们在学习SQLite的使用,介绍过部分adb命令的使用,见Pro Android学习笔记(五):了解Conten ...

  7. JVM插庄之一:JVM字节码增强技术介绍及入门示例

    字节码增强技术:AOP技术其实就是字节码增强技术,JVM提供的动态代理追根究底也是字节码增强技术. 目的:在Java字节码生成之后,对其进行修改,增强其功能,这种方式相当于对应用程序的二进制文件进行修 ...

  8. MongoDB之二基础入门(window/linux安装启动)

    mongodb中有三元素:数据库,集合,文档,其中“集合”就是对应关系数据库中的“表”,“文档”对应“行”. 一window安装与启动 一. 下载 上MongoDB官网 ,下载页面:https://w ...

  9. 2 ubuntu 16.04 安装Elastic Stack

    一: 安装JAVA8          添加ppa sudo add-apt-repository ppa:webupd8team/java sudo apt-get update 安装oracle- ...

  10. assert.fail()

    assert.fail(message) assert.fail(actual, expected[, message[, operator[, stackStartFunction]]]) oper ...