admin 发表于 2015-3-9 08:33:39

WAP重构整理

WAP重构(html5+css3来重构,减少很多图片的处理,还有就是宽度自适应的问题等等)
现在的WAP一般都会分为触屏版和标准版
1、尽量不要为页面的元素指定高度;
      UCWeb和GO浏览器不支持宽度,自动100%显示页面;
      UCWeb不支持左右边框,支持上下边框
2、页面使用100%宽度,兼容性最佳;
3、必须要显示的图案,不要用背景图,直接使用<img>标签;
4、避免同时出现多种文字大小,部分浏览器的字体大小是由用户设置的;
5、不要过分纠结于粗体和斜体,这取决于手机自带字体的特性。
6、为每一个有背景图的元素添加背景色;
7、背景色和文字颜色组合使用,也能产生很好的视觉效果;
8、UCWeb和GO浏览器不支持宽度,自动100%宽度显示页面。
9、如果你的页面使用的是100%的宽度,背景图最好使用可以平铺或重复的图片。、
10、设计时尽量避免左对齐之外的对齐方式;
11、部分浏览器链接的下划线是否出现不可控,取决于用户的设置;
12、字间距和文本缩进,尽量避免使用。
13、合理的使用行高让页面的可读性更好;不支持指定行高的浏览器也有默认的行高
             UCWeb支持文本居中;但不支持右对齐。
14、大部分浏览器不支持定义已访问连接(a:visited)的颜色,设计时请注意链接的背景色不要与该浏览器默认已访问的连接色接近;
15、连接的颜色可以指定,连接是否带下划线取决于浏览器的设置。
16、合理的使用全局选择符;提升效率;
17、class和id选择符是可以放心使用的。
18、可以通过选择符支持的差异,来为不同的浏览器实现不同的效果
19、说明下:position:fixed在手机里面兼容性不是很好,尤其是在UC里面,如果要求比较高的话,老老实实用JS写吧
20、尽量避免使用table
页: [1]
查看完整版本: WAP重构整理