铺手机页面

之前其实一直都没有写过手机页面，然后今天第一次写手机页面，也是一个比较简单的页面，我在里面遇到的几个问题。

1.全局设置的时候。

    body { width:100%; height:100%; position:absolute; left:0; top:0; }

2.我这边还是用的div布局，背景图要能全屏显示，background-size给到100%

3.背景给到相对定位，其他的要具体定位的地方在给到绝对定位

4.因为写的时候就没有考虑到安卓机，这里只考虑到苹果的手机，更具他的宽度的显示的不同调节背景图片的高度的问题

 <script>
            var WW=$(window).width();
            if(WW == 320){
                $('.top').css('height','380px');
            }else if(WW == 375){
                $('.top').css('height','440px');
            }else if(WW == 414){
                $('.top').css('height','490px');
            }
        </script>

5.字体的角度旋转，这个用到的css3的transform，但是不同的浏览器兼容不一样。

div
{
transform:rotate(7deg);
-ms-transform:rotate(7deg); 	/* IE 9 */
-moz-transform:rotate(7deg); 	/* Firefox */
-webkit-transform:rotate(7deg); /* Safari 和 Chrome */
-o-transform:rotate(7deg); 	/* Opera */
}