wap学习记录

针对移动端浏览器:

大部分的浏览器内核都是webkit内核,对h5和c3的支持非常好

国内比较流行的框架 : 妹子UI

bootstrap中解决ie8以及以下的h5标签和媒体查询兼容问题的两个库分别是:html5shiv 和 respond.js 

前端开发资源库:https://www.awesomes.cn/

最好不使用jq,因为它做了大量的兼容,对于移动端大部分都是高版本的浏览器来说没必要,体积大

样式

对a标签有特有的点击有默认的灰色背景效果,可以通过css 的tap-higlight-color 来设置或清除

对input、textarea会有默认的样式,通过appearance:none来reset掉

流式布局,一般要*统配设置border-box方便一点,版心容器设置百分比的宽度,然后max,min来限制宽度为320~640(假如设计稿是640px),居中显示

640px是早期的psd设计稿的标准,参照iPhone4(宽度320,2dpr,640px的页面缩小1/2倍之后,能完美显示到iPhone4上)

750px是现在的标准,参照iPhone6(宽度375,2dpr,也能完美显示)

所以拿到多大的设计稿,就做宽度多大的

想要背景透明,但容器内容不透明的话,就采用rgba

js中媒体查询的方式:获取客户区的宽度,来判断,再进行样式或者dom操作

原文地址:https://www.cnblogs.com/hellohello/p/7826417.html