手机页面开发总结_

1,图片像素不要用具体px,要用% px

2,左右边距也用%px

3,字体上,如果太小的px 手机上和电脑上是有区别的最好的情况是用pt

4,对于get请求所带参数,参数之间不要留空格,不然读取数据时会取不到值

   (面对如果名称没有错,值也有的情况,那么就观察你的url 看参数名称之后是否出现奇怪的字符)

5,面对多个单选框取值,首先为他们取同一个name 值(这样能保证它只能单选,不会出现多选)->给他们赋value值->循环单选框判断他们的checked 属性,在取值

6, 面对不同手机的不同系统可能会出现宽度不同的情况,

    (

//  actionInfo   myButton 样式

var buttonWidth = $(".actionInfo").width() + 44;
$(".myButton").width(buttonWidth);

)

7,前提页面获取系统当前时间与你所定义时间对比 

 ( new Date().getTime() < new Date(endtime).getTime()  转化成同一串数字 )

8,判断距离结束时间的方法 

   // endTime  定义的结束时间       
  function D_Time(endTime) {
            var obj = $("#lbl_Time");
            var endtime = new Date(endTime).getTime();
            var nowtime = new Date().getTime();
            var youtime = endtime - nowtime;
            var seconds = youtime / 1000;
            var minutes = Math.floor(seconds / 60);
            var hours = Math.floor(minutes / 60);
            var days = Math.floor(hours / 24);
            var CDay = days;
            var CHour = hours % 24;
            var CMinute = minutes % 60;
            var CSecond = Math.floor(seconds % 60);
            if (endtime <= nowtime) {
                obj.html("已过期");

            } else {
                if (days > 0) {
                    obj.append("" + days + "天" + CHour + "时" + CMinute + "分" + CSecond + "秒");
                }
                else if (CHour > 0) {
                    obj.append("" + CHour + "时" + CMinute + "分" + CSecond + "秒");
                }
                else if (CMinute > 0) {
                    obj.append("" + CMinute + "分" + CSecond + "秒");
                }
                else if (CSecond > 0) {
                    obj.append("" + CSecond + "秒");
                }
            }
            setTimeout("D_Time()", 1000);
        }

 9,防止页面出现缩放

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />
    <meta http-equiv="pragma" content="no-cache" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="expires" content="0" />
    <meta charset="utf-8" />

 10,文本框变直线

     70px;
    border: 0;
    border-bottom: thin solid;
    //解决苹果手机自带的圆角效果
    border-radius: 0px;
    background-color: #f4f4f4;