移动端web头部header通用写法


1.head部分 通用写法;网上也有,不过有的可有有的可无;原理是兼容IOS透明栏目等问题,再者就是viewport(关键)

登录后复制


2.引入引用flexible.js;这是淘宝的兼容解决方案,最大到5.5寸;用的时候把viewport去掉,flexible.js会动态添加;
主要讲一下用法,网上的讲的太细却使很多网友没懂;flexible.js只有4K,作用是:
1.动态改写 标签
2.给 元素添加 data-dpr 属性,并且动态改写 data-dpr 的值
3.给 元素添加 font-size 属性,并且动态改写 font-size 的值
接下来就可以用了,若你的图示640的 就设置1rem=64px如果是750的就设置1rem=75px;比如320X240的banner,那么就换算成5remX3.75rem(640为例)
下载地址http://www.w3cfuns.com/misc.php?mod=attach&genre=file&aid=1cec8fecbbaf2bf347f2a749486a6525

参考博文:http://www.w3cfuns.com/notes/20813/fecbb840a2574cf712a8625f88a7ab3a.html

09-13 14:53