本文详细介绍了HTML5移动Web App阅读器的页面基本结构开发，包括上下边栏的绝对定位、内容区的布局，以及引用的库如normalize.css、zepto.min.js等。还探讨了如何处理数字识别为电话号码的问题，并强调了CSS逻辑和性能优化的重要性。在交互设计上，提到了返回、字号和背景设置、翻页操作的实现，以及localStorage的数据存储。对于事件绑定，选择了click事件而非touch或tap，以避免旧版安卓设备的300毫秒延迟问题。
任务：
上下边栏：绝对定位或者fixed.相对独立，所以可以放到一个相对独立过程中去。
然后就是内容区：标题，内容，操作条 。
引用normailze.css，zepto.min.js，jquery.base64.js，jquery.jsonp.js
Zepto是为现代智能手机浏览器推出的Javascript 框架, 有和jQuery相似的语法，不过更小
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,minimal-ui">- width – // viewport 的宽度 （范围从 200 到 10,000，默认为 980 像素）
- height – // viewport 的高度 （范围从 223 到 10,000 ）
- initial-scale – // 初始的缩放比例 （范围从 > 0 到 10）
- minimum-scale – // 允许用户缩放到的最小比例
- maximum-scale – // 允许用户缩放到的最大比例
- user-scalable – // 用户是否可以手动缩放 (no，yes)
<meta name="format-detection" content="telephone=no">
格式识别忽略页面中的数字识别为电话号码
- 使设备浏览网页时对数字不启用电话功能（不同设备解释不同，iTouch 点击数字为存入联系人，iPhone 为拨打电话），忽略将页面中的数字识别为电话号码。
- 若需要启用电话功能将 telephone=yes 即可，若在页面上面有 Google Maps, iTunes 和 YouTube 的链接会在ios设备上打开相应的程序组件。
- 结构和样式都是从大局观开始，然后再抠细节
- 如果想要好看，还是需要靠自己一点一点的量（位置，颜色）
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,minimal-ui">
<meta name="format-detection" content="telephone=no">
<meta name="author" contect="hanxiao, 15132445252@163.com" />
<link rel="stylesheet" href="css/normailze.css">
<link rel="stylesheet" href="css/base.css">
</head>
<body>
<
最低0.47元/天 解锁文章
1014
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
