WAP项目开发总结

最近在做一个WAP网站，其中遇到了一些细节点，现整理与总结一下：

基于WebKit核心的浏览器包含Android Google Chrome, IOS safari，所以要想做一个兼容性好的WAP网站，需要对WebKit做一个了解。

http://www.w3school.com.cn/html5/html_5_form_input_types.asp

1.聚焦到文本框时，会弹出的键盘，这时大写键会自动打开，解决办法<textarea name="" autocapitalize="off"></textarea>

2.聚焦到输入电话号码的文本框时，需要直接弹出数字键盘。<input  type="tel" name="telphone_num" value="" />

3.聚焦到输入email的文本框时，需要直接弹出书写email键盘。<input  type="email" name="email" value="" />

4.为input框加入文字提示。<input type="text" placeholder="用户名/邮箱/已验证手机号" name="userInput" class="common-input" id="userInput">，这里，iphone4的safiri有个问题，就是当由竖屏转横屏后，再转竖屏，就会出现问题，这时，需要在input外容器加一个overflow:hidden

5.在页面分工上，需要使开发人员先设计页面框架(头、尾、布局模板(左右结构等))，对各个页面做单独的页面样式的编写并做上注释。避免相互引用样式，当修订一个页面样式时，导致其它页面的样式受牵连；

6.在美工制作效果图时，如果不按指定的尺寸做效果图的话，前端开发人员要对页面进行等比例缩放，有时页面元素会失真；

7.在页面中，如果存在文本式的电话号码时，要做成click-to-call类型，在拨打完电话后，最好能回到原有页面；

8.为WAP站点设立二级域名；m.xxxx.com

9.根据屏幕大小做页面的自适应(media query)；如果页面本身比较简单，一般做成单列结构，宽无限，高也无限；