<!DOCTYPE html>
<html lang="ch">
<head>
<meta charset="utf-8" />
<meta HTTP-EQUIV="pragma" CONTENT="no-cache">
<meta HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<meta HTTP-EQUIV="expires" CONTENT="0">
<meta name="apple-touch-fullscreen" content="yes" />
<meta name="format-detection" content="telephone=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta http-equiv="Expires" content="-1" />
<meta http-equiv="pragram" content="no-cache" /> <base href="http://app.cntcma.com/">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>第二届京津冀协同发展论坛</title><meta name="sharecontent" data-msg-img='http://app.cntcma.com/attachments/image/20141113/20141113205001_32033.png' data-msg-title='第二届京津冀协同发展论坛' data-msg-content='敬请关注' data-msg-callBack='' data-line-img='http://app.cntcma.com/attachments/image/20141113/20141113205001_32033.png' data-line-title='第二届京津冀协同发展论坛' data-line-callBack='' />
<script type="text/javascript">
if(/Android (\d+\.\d+)/.test(navigator.userAgent)){
var version = parseFloat(RegExp.$1);
if(version>2.3){
var phoneScale = parseInt(window.screen.width)/640;
document.write('<meta name="viewport" content="width=640, minimum-scale = '+ phoneScale +', maximum-scale = '+ phoneScale +', target-densitydpi=device-dpi">');
}else{
document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
}
}else{
document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
} //微信去掉下方刷新栏
if(RegExp("MicroMessenger").test(navigator.userAgent)){
document.addEventListener('WeixinJSBridgeReady', function() {
WeixinJSBridge.call('hideToolbar');
});
}
</script>

参考的页面:http://app.cntcma.com/wx/35f4a8d465e6e1edc05f3d8ab658c551.html

还看见一个鸡贼的东西

width: 100%;
max-width: 600px;

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

这个更省事,都不用单独写viewport了

css动画里面播放完了,不在初始位置,而在最终位置的css规则为

-webkit-animation-fill-mode: both;
animation-fill-mode: both;

要想div高度100%,先得设置 html和body的高度100%

viewport 640宽的做法 针对iphone和安卓单独设置的更多相关文章

  1. H5页面适配所有iPhone和安卓机型的六个技巧

    http://www.th7.cn/web/html-css/201605/166006.shtml http://www.th7.cn/web/html-css/201601/153127.shtm ...

  2. 如果需要将UIView的4个角全部都为圆角,做法相当简单,只需设置其Layer的cornerRadius属性即可

    如果需要将UIView的4个角全部都为圆角,做法相当简单,只需设置其Layer的cornerRadius属性即可(项目需要使用QuartzCore框架).而若要指定某几个角(小于4)为圆角而别的不变时 ...

  3. 关于iphone、安卓手机VPN全面解析

    现在智能手机功能越来越强大,网络APP层出不穷,社交大佬facebook.twitter等纷纷推出了自己的社交APP应用,大部分手机已经内置了很多社交应用,包括facebook等:android.io ...

  4. iphone与安卓的兼容性问题汇总

    1.日期问题 当使用yyyy-mm-dd格式时,iphone不认,安卓没问题 解决办法:new Date(res.data[i].inventoryDate.replace(/-/g, "/ ...

  5. 移动平台前端开发总结(针对iphone,Android等手机)

    移动平台前端开发是指针对高端智能手机(如Iphone.Android)做站点适配也就是WebApp,并非是针对普通手机开发Wap 2.0,所以在阅读本篇文章以前,你需要对webkit内核的浏览器有一定 ...

  6. 针对iPhone的pt、Android的dp、HTML的css像素与dpr、设计尺寸和物理像素的浅分析

    最近被一朋友问到:css中设置一DOM的height:65px,请问显示的高度是否和Android的65dp的元素等高?脑子里瞬间闪现了一堆的概念,如dpr,ppi,dp,pt等,然而想了一阵,浆糊了 ...

  7. 如何针对 iPhone X 设计网站?

    在全面屏的 iPhone X 上,不需要而外的代码,Safari 可以非常完美的展示现有的网站.整个网站的内容都会自动地展示在一个“安全区域”内,并不会被四周的圆角或者“小刘海”遮挡住. Safari ...

  8. 微信也有土豪版 针对iPhone 6/6 Plus进行优化

    土豪们最近都上手iPhone 6/6 Plus了,烦恼的是iPhone 6/Plus增大了屏幕和分辨率,由此带来了不少应用的适配问题,排版乱了,app周边多了一片空白,是不是很煞风景?微信团队昨天放出 ...

  9. unity针对iphone的屏幕旋转

    屏幕旋转可以在引擎里设置: 依次点开 Edit——Project Setting——Player 即可设置如图: 接下来的是 雨松大神的 代码控制,本屌是安卓机器,没能测试. C# using Uni ...

随机推荐

  1. get the page name from url

    https://stackoverflow.com/questions/1874532/better-way-to-get-page-name The way I interpret the ques ...

  2. Linux 杀死所有进程

    方法一: sudo killall -9 netease-cloud-music 这种方法,必须要写全称. sudo netease-cloud-music QStandardPaths: XDG_R ...

  3. Java 内存管理、JVM 工作原理与 Java 运行时系统

    Java 虚拟机规范中说明:所有的对象实例(all class instances)以及数组都要在堆上分配: the heap is the runtime data area from which ...

  4. win7下IIS7.0虚拟目录不存在的问题

    问题:在IIS7.0下选中虚拟目录,右边浏览应用程序下,自动打开浏览器找开虚拟目录下的网站,但过一会什么都没有改变,再一次右边浏览应用程序,就提示 “虚拟目录不存在”. 解决方法:右键网站或下面的虚拟 ...

  5. c语言和c++栈的简单实现以及构造器的原理

    也就是训练将原来的c语言 用类表示出来.. 关于构造器: //1与类名相同 没有返回值 被系统生成对象时自动调用,用于初始化 //2 可以有参数 构造器重载 默认参数 //3 重载和默认不能同时存在, ...

  6. Linux 系统管理命令 - iotop - 动态显示磁盘 I/O 统计信息

    命令详解 重要星级: ★★★★☆ 功能说明: iotop 命令是一款实时监控磁盘 I/O 的工具, 但必须以 root 用户的身份运行.使用 iotop 命令可以很方便的查看每个进程使用磁盘 I/O ...

  7. 机器学习--DIY笔记与感悟--①K-临近算法

    ##“计算机出身要紧跟潮流” 机器学习作为如今发展的趋势需要被我们所掌握.而今我也需要开始learn机器学习,并将之后的所作所想记录在此. 今天我开始第一课--K临近算法. 一.k-临近的基础概念理解 ...

  8. (11)用css设计电子相册 {上}

    本篇学习资料讲解:       通过css对电子相册进行排版 和 侧面强调“盒子模型.标准流.浮动和定位”的重要性. 先来看看"双向联动模式"的电子相册图: {鼠标指针经过某张图片 ...

  9. 【原创】《从0开始学RocketMQ》—集群搭建

    用两台服务器,搭建出一个双master双slave.无单点故障的高可用 RocketMQ 集群.此处假设两台服务器的物理 IP 分别为:192.168.50.1.192.168.50.2. 内容目录 ...

  10. BZOJ2006 超级钢琴

    Description ​ 给定一个长度为n的区间,询问前k大的区间和,区间长度\(\in [L, R]\). $ n, k <= 500000$ Solution ​ 首先求前缀和.把一个区间 ...