其实主要就是改掉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. 第三章： web界面操作

    3.1 zabbix的web安装 3.1.1 使用浏览器访问 http://10.0.0.61/zabbix/setup.php 在检测信息时,可查看具体的报错信息进行不同的解决 选择mysql数据库 ...

  2. mysql命令行批量插入100条数据命令

    先介绍一个关键字的使用: delimiter 定好结束符为"$$",(定义的时候需要加上一个空格) 然后最后又定义为";", MYSQL的默认结束符为" ...

  3. win10使用4G 模块RNDIS模式上网

    Windons使用RNDIS模式上网步骤 Chapter 1 模块端配置 1模块设置为RNDIS模式 1.       以EC20CEFAG模块为例 2.       命令如下: 1)         ...

  4. echart-map

    1.非模块下引入地图: echarts.util.mapData.params.params.HK={ getGeoJson:function(callback){ $.getJSON('geoJso ...

  5. root用户以修改文件的方式,修改用户密码

    老早就听说linux的用户密码只是存储在普通的文本文件里,但一直没去了解,今天遇上了需要强行修改的情况... 给碰到个奇葩linux,居然没有passwd命令. 生成密码摘要 openssl pass ...

  6. 通过 SSH 转发TCP连接数据

    设定 首先双方的/etc/ssh/sshd_config设定以下四项: AllowAgentForwarding yes AllowTcpForwarding yes GatewayPorts yes ...

  7. MySQL查询表的所有列名，用逗号拼接

    问题场景 在MySQL中,需要以逗号拼接一个表的所有字段 sql语句 SELECT GROUP_CONCAT(COLUMN_NAME SEPARATOR ",") FROM inf ...

  8. C，C#，Java：枚举类型

    #include <stdio.h> main() { // 枚举默认从0开始,这里指定为1起头 , Tues, Wed, Thurs, Fri, Sat, Sun } day; scan ...

  9. ajax事件执行顺序

    1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success(请求成功时调用) 5.ajaxSuccess(全局事件) 6.error 7.aja ...

  10. web前端全栈学习之路

    web前端全栈学习之路 --- 陆续更新中 一.HTML相关 1.HTML常用标签:http://www.cnblogs.com/wyb666/p/8733699.html 2.HTML5基础: 3. ...