HTML5基础实例教程
HTML5 的离线存储、多媒体支持和图形能力配上 jQuery Mobile 的轻量交互，是前端工程师早期练手的绝配。嗯，如果你刚开始接触移动 Web 开发，那这个“html5 简单实例”还蛮适合你看的。页面结构清晰，代码也不复杂，适合边看边学。
离线存储方面，用localStorage或sessionStorage保存用户数据，断网也能访问，像表单缓存、用户设置就挺合适。多媒体元素方面，直接上<audio>和<video>，不用再折腾 Flash 插件，方便多了。
画图功能这块，HTML5 的支持 JavaScript 绘图，做个小游戏或者画个实时图表都够用。而SVG就适合线条清晰的图形，比如图标、流程图那种，缩放不糊。
表单控件的升级也不错，像<input type="date">、Geolocation API拿到用户位置，像做定位签到、附近推荐这些功能也不难。
再说说 jQuery Mobile，结构上用data-role="page"来划分页面，用header、content、footer来组织内容。配上它内置的主题，调样式也方便，一堆data-theme属性就能搞定。
而且它的触控体验优化得还行，比如滑动切换页面、点击反馈这些，响应也快。导航页面用的是 Ajax 加载，过渡效果自然，看起来也顺。嗯，对了，它还考虑了可访问性，符合WCAG 2.0标准，细节挺到位。
你可以看看jquery.mobile0705这个文件，基本涵盖了 HTML 结构、样式和 jQuery 代码的完整应用，适合你拿来改一改玩一玩。如果你想结合实际开发使用，别忘了调试一下不同设备下的适配效果。
文件大小：852.34KB
评论区