2017年09月25日 11:30:27 Goddess_liangyanli 阅读数:7324 标签: 手机
 
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/sinat_39430615/article/details/78083412
  1. <meta name="viewport" content="width=device-width,initial-scale=1">
  1. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />

在网页的<head>中增加以上这句话,可以让网页的宽度自动适应手机屏幕的宽度。

其中:

width=device-width :表示宽度是设备屏幕的宽度

initial-scale=1.0:表示初始的缩放比例

minimum-scale=0.5:表示最小的缩放比例

maximum-scale=2.0:表示最大的缩放比例

user-scalable=yes:表示用户是否可以调整缩放比例

如果是想要一打开网页,则自动以原始比例显示,并且不允许用户修改的话,则是:

  1. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />

页头横幅等的图片的宽度都设置成style="width:100%",整个页面在设备上看起来就是全屏的了。

页面适应电脑和手机屏幕initial-scale 1:0 user-scalable=yes的更多相关文章

  1. asp.net 页面,文字自适应手机屏幕

    (1)在<head>和</head>之间插入代码. <meta name="viewport" content="width=device- ...

  2. js实现仿华为手机计算器,兼容电脑和手机屏幕

    效果图: 电脑端: 手机端: 源码: <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  3. JS获取电脑或手机屏幕的分辨率

    s = " 屏幕分辨率的高:"+ window.screen.height+"\n"; s += " 屏幕分辨率的宽:"+ window.s ...

  4. flexible.js在华某为手机上使用rem时,页面宽度超出手机屏幕宽度

    问题:手机端项目在华为的某款手机上显示时页面内容没有自适应手机宽度,出现横向滚动条 原因:手机获取手机屏幕宽度并计算出rem时出现偏差,明显宽余真实手机屏宽度 解决方案一:在页面里获取页面最外层dom ...

  5. 移动页面HTML5自适应手机屏幕宽度

    标签: 网上关于这方面的文章有很多,重复的东西本文不再赘述,仅提供思路,并解释一些其他文章讲述模糊的地方. 1.使用meta标签,这也是普遍使用的方法,理论上讲使用这个标签是可以适应所有尺寸的屏幕的, ...

  6. 移动端H5页面自适应手机屏幕宽度

    1.由于本人使用的是sublime.text,使用rem就可以达到效果. 点击菜单中的preferences下的browse packages,选择cssrem-master,添加或者编写cssrem ...

  7. 在电脑上操作手机屏幕scrcpy工具就搞定了

    手机安卓版本:10 电脑:win64 使用步骤 电脑步骤 下载scrcpy scrcpy 是免费开源的投屏软件,支持将安卓手机屏幕投放在 Windows.macOS.GNU/Linux 上,并可直接借 ...

  8. 相机拍的图,电脑上画的图,word里的文字,电脑屏幕,手机屏幕,相机屏幕显示大小一切的一切都搞明白了!

    相机拍的图,电脑上画的图,word里的文字,电脑屏幕,手机屏幕,相机屏幕显示大小一切的一切都搞明白了! 先说图片X×dpi=点数dotX是图片实际尺寸,简单点,我们只算图片的高吧,比如说拍了张图片14 ...

  9. web页面自适应手机屏幕宽度

    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scal ...

随机推荐

  1. Boost--optional

    #include <vector> #include <deque> #include <iostream> #include <array> #inc ...

  2. C++11--20分钟了解C++11 (下)

    20分钟了解C++11 9 override关键字 (虚函数使用) * * 避免在派生类中意外地生成新函数 */ // C++ 03 class Dog { virtual void A(int); ...

  3. MySQL 服务启动y异常: 本地无法启动MySQL服务,报的错误:1067,进程意外终止---解决

    启动MySQL后,几秒钟后直接报错了 然后在事件查看器中发现了几条错误信息 Can't start server: Bind on TCP/IP port: No such file or direc ...

  4. Lzma(7-zip)和zlib

    Lzma(7-zip) 使用: 在C目录中有算法文件,进入Util\LzmaLib目录,编译生成LIB库,导出了以下两函数,LzmaCompress 为压缩函数,LzmaUncompress 为解压缩 ...

  5. MySQL面试题和答案

    Mysql 的存储引擎,myisam和innodb的区别. 答: 1.MyISAM 是非事务的存储引擎,适合用于频繁查询的应用.表锁,不会出现死锁,适合小数据,小并发. 2.innodb是支持事务的存 ...

  6. docker构建tomcat镜像

    下载centos镜像 # docker pull daocloud.io/centos:7 [root@localhost ~]# docker pull daocloud.io/centos: : ...

  7. 在MySQL中实现Rank高级排名函数

    MySQL中没有Rank排名函数,当我们需要查询排名时,只能使用MySQL数据库中的基本查询语句来查询普通排名.尽管如此,可不要小瞧基础而简单的查询语句,我们可以利用其来达到Rank函数一样的高级排名 ...

  8. jQuery动态创建DOM节点

    var SKU=$("#SKU"); // 通过ID查找到指定表格 var oTable=SKU[0]; // 获取第一个表格 // 获取正文tbody元素 var tBodies ...

  9. Python的dict与set

    一.dict 其他语言中也称为map,使用键-值(key-value)存储 特点: 具有极快的查找速度:可以直接由key计算出value所在的内存地址,而list采用搜索的方式:dict付出的代价是内 ...

  10. JVM总结-反射

    反射是 Java 语言中一个相当重要的特性,它允许正在运行的 Java 程序观测,甚至是修改程序的动态行为. 举例来说,我们可以通过 Class 对象枚举该类中的所有方法,我们还可以通过 Method ...