Android
Android与HTML5可交互常见问题 Android中webview加载网页无法点击或滚动
首选是大神写的文章： 使用Flexible实现手淘H5页面(http://www.w3cplus.com/mobile/lib-flexible-for-html5-layout.html) 接着是Flexible项目的GitHub地址(https://github.com/amfe/lib-flexible)
实战之后，有了更清晰的理解，具体如下：
- 有了flexible.js，移动端页面不用viewport 的meta标签
<head>
<meta charset="UTF-8">
<title>淘宝flexible实战</title>
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="yes" name="apple-touch-fullscreen">
<meta content="telephone=no,email=no" name="format-detection">
<link rel="apple-touch-icon" href="favicon.png">
<link rel="Shortcut Icon" href="favicon.png" type="image/x-icon">
<script type="text/javascript" src="js/flexible.js"></script>
</head>
-
一般，除了border和font-size的单位用px外，其他(width/height/padding/margin)的单位都用rem
-
假如设计稿的宽度为750px，表示为2倍设计稿， [data-dpr=”2”] .title{font-size:24px;} 这里的font-size 与 宽度为750px的设计稿一致
-
其他的 .title{font-size:12px;} 设计稿字号/2 [data-dpr=”3”] .title{font-size:36px} 设计稿字号/2*3
-
.cssrem插件 首先大神写的cssrem插件 (https://github.com/flashlizi/cssrem)
{ "px_to_rem": 75, 这个值，根据设计稿进行修改 (宽度750设计稿，该值为75) "max_rem_fraction_length": 6, "available_file_types": [".css", ".less", ".sass"] }
