其实主要就是改掉HTML页面声明：

在网页中加入以下代码，就可以正常显示了：

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

解释：

device-width 是viewport的宽度

device-height 是viewport的高度
initial-scale 初始的缩放比例
minimum-scale 允许用户缩放到的最小比例
maximum-scale 允许用户缩放到的最大比例
user-scalable 用户是否可以手动缩放

精简点的话，可以把上面的代码更改为以下代码，效果是一样的：

<meta content="width=device-width,user-scalable=no" name="viewport">

最后就是不要设置太大的具体宽度属性了，比如你在网页把Body的宽度属性设为1000px，这肯定是不行的了，但是可以设置为90%，这是屏幕自适应的。

<!doctype html>

<html>

    <head>

        <title>手机浏览器页面</title>

        <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">

        <meta name="apple-mobile-web-app-capable" content="yes">

        <meta name="apple-mobile-web-app-status-bar-style" content="black">

        <meta name="format-detection" content="telephone=no">

    </head>

    <body>

        <div>

            此页面适应手机端浏览器

        </div>

    </body>

</html>

html兼容手机浏览器的更多相关文章

  1. css3在不同型号手机浏览器上的兼容一览表

    网上搜集了css3对不同系统手机浏览器的支持情况(ios/android/winphone)备份一下以便查看.  以下资料由微信产品部"白树"整理, 转载请注明. √:完全支持   ...

  2. 手机浏览器通过Scheme跳转APP，兼容各种手机浏览器

    一个比较完整的产品线,必定有APP和网站,另外还有微信公众号网页和小程序.那么有一个比较常见的需求就是在手机浏览器内打开APP,实现起来也比较简单,只要APP配置的有URLScheme即可. 但是因为 ...

  3. 华为手机浏览器不支持PUT提交方式的解决方案

    最近所在技术团队在开发webapp项目,前端angularjs+后端.Net MVC API,API登录接口定义为PUT提交方式,在做兼容测试时发现UC.safari.微信浏览器下都可以登录,但在华为 ...

  4. 【转】让Bootstrap 3兼容IE8浏览器

    FROM : http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html 最近在研究Bootstrap(官方,Github)这个 ...

  5. 让Bootstrap 3兼容IE8浏览器

    最近在研究Bootstrap(官方,Github)这个优秀的前端框架,Bootstrap最开始是Twitter团队内部的一个前端框架,所谓前端框架就是一个CSS/HTML框架,框架里面有下拉菜单.按钮 ...

  6. Bootstrap 3兼容IE8浏览器（转）

    Bootstrap是一个响应式的布局,你可以在宽屏电脑.普通电脑,平板电脑,手机上都得到非常优秀的布局体验.这种响应式的布局正是通过CSS3的媒体查询(Media Query)功能实现的,根据不同的分 ...

  7. Bootstrap 3 兼容 IE8 浏览器

    公司新上的项目,前端用的Bootstrap3的框架,但它已经放弃对IE9下的支持了.可IE8还是有着许多用户,不能不照顾到他们,IE7以下的,我只想说,现在什么年代了,要解放思想,与时俱进啊,就不能动 ...

  8. js判断是否为手机浏览器

    JS判断手机浏览器 判断原理: JavaScript是前端开发的主要语言,我们可以通过 编写JavaScript程序来判断浏览器的类型及版本.JavaScript判断浏览器类型一般有两种办法,一种是根 ...

  9. UC手机浏览器js加入收藏夹

    概述 对于某些网站来说,让用户一键把网页加入收藏夹的设计是非常棒的,它能提醒用户把网页加入收藏夹,从而增加用户的回访率,使网站获得更多的流量. 在PC端,只有ie和ff支持用js把网页加入收藏夹的操作 ...

随机推荐

  1. Socket拆包和解包

    对于基于TCP开发的通讯程序,有个很重要的问题需要解决,就是封包和拆包.下面就针对这个问题谈谈我的想法,抛砖引玉.若有不对,不妥之处,恳求大家指正.在此先谢过大家了. 一.为什么基于TCP的通讯程序需 ...

  2. SCCM2012 R2实战系列之七：软件分发（exe）

    在上一章节中,我们完成了SCCM 2012客户端代理软件的安装,现在就可以为客户端来部署应用程序了. SCCM2012增加了应用程序分发,同时保留了SCCM 2007里的包分发.应用程序分发可以直接对 ...

  3. Mysql配置参数sync_binlog说明

    Mysql配置参数sync_binlog说明 mysql> select version(); +-----------+ | version() | +-----------+ | | +-- ...

  4. linux 批量替换

    sed -i "s/新内容/原内容/g" `ls *.html` sed -i "s/新内容/原内容/g/g" `ls *.php` sed -i " ...

  5. Windows Server 2012R2 网络地址转换NAT

    一.NAT概述 网络地址转换NAT(Network Address Translation)可以动态改变通过路由器的IP报文的内容(修改报文的源IP地址和/或目的IP地址).离开路由器的报文的源地址或 ...

  6. CF1139D Steps to One （莫比乌斯反演 期望dp）

    \[ f[1] = 0 \] \[ f[i] = 1 + \frac{1}{m} \sum_{j = 1} ^ n f[gcd(i, j)] \ \ \ \ \ \ (i != 1) \] 然后发现后 ...

  7. kotlin的安装（一）

    1.下载Kotlin Compiler Kotlin 命令行环境主要依赖就是Kotlin Compiler,目前最新版本是 1.1.2-2.其下载链接是:https://github.com/JetB ...

  8. Linux架构分布式集群之基础篇

    部署linux环境,安装jdk 1.安装rar命令行 wget http://www.rarlab.com/rar/rarlinux-x64-4.2.0.tar.gz由于在此目录下解压rar后linu ...

  9. 5、申请开发(Development)描述文件

    申请开发(Development)描述文件 在“Certificates, Identifiers & Profiles”页面“Provisioning Profiles”下选择“Develo ...

  10. 1.HTML+CSS写个8

    感想: 有点缺陷.效果地址:https://codepen.io/flyingliao/pen/QobdyE HTML code: <div class="eight"> ...