html+css适配移动端设备

最近做了一个项目，是用html+css写代码，要求适应所有ipad和andriod平板。以webview/UIWebView为基础，开发出andriod和ipad的APP.

整个页面的制作过程都按照响应式的需求写的：
1.<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
           width设置viewport的宽度，即iphone最初模拟PC浏览器的宽度，之后iphone会按这个宽度展现的页面同比缩放到iphone屏幕上。设置width=device-width后就不会再进行缩放了，因为宽度正好和iphone的宽度相同（前提是没有设置缩放比例）。
        minimum-scale和maximum-scale是控制用户允许设置的缩放比例的。
        user-scalable标识是否允许对页面进行缩放，取值有两个yes和no。设置为no则不允许进行页面缩放了。
        initial-scale设置用户最初看到页面时的缩放比例。
强调：在制作过程中andriod端硬件设备不一，需要另加一行代码 ：target-densitydpi=device-dpi。
        target-densitydpi 可以设定的值
        device-dpi 设备本身像素
        high-dpi 用高像素，中低像素屏幕适当缩小
        medium-dpi 中等像素，高的屏幕放大，低的变小是默认值
        low-dpi 低像素，中高像素会适当变大
2.页面布局全部采用百分比，高度可以是固定值。
3.页面文字只设置body的文字大小，其他font-size单位匀为em/rem.我这次写是按rem.区别在于:em是按照你父元素的大小显示，rem是按照body的设置大小显示。
4.图片优化：所有小的图片都放到一张上。
5.遇到难点：幻灯片在移动端滑动翻页效果，最后找个案例换上去了，但是还是希望自己能写出来，希望有会的朋友指导一二。
提供一下制作完一期的网址：http://pad.hktv.tv.
6.关于video标签的制作：html5的video标签确实强大，但是制作过程中，发现ios中的safire浏览器不支持自动播放，这个结论查询资料和亲自测验了一天才确定。
7.未完，待续…………………………