首页 > 后端开发 > php教程 > 移动端web头部header通用写法_PHP教程

移动端web头部header通用写法_PHP教程

WBOY
发布: 2016-07-12 08:54:45
原创
1379 人浏览过

移动端web头部header通用写法

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

<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li><head lang="en"><br /></li><li><meta charset="UTF-8"><br /></li><li><br /></li><li><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/><br /></li><li><br /></li><li><meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"><br /></li><li><br /></li><li><meta name="apple-mobile-web-app-title" content=""><br /></li><li><br /></li><li><meta name="apple-mobile-web-app-capable" content="yes"/><br /></li><li><br /></li><li><meta name="apple-mobile-web-app-status-bar-style" content="black"/><br /></li><li><br /></li><li><meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL"><br /></li><li><br /></li><li><meta name="format-detection" content="telphone=no, email=no"/><br /></li><li><br /></li><li><meta http-equiv="Pragma" content="no-cache"><br /></li><li><meta http-equiv="Cache-Control" content="no-cache"><br /></li><li><meta http-equiv="Expires" content="0"><br /></li><li><title>web前端-马乐</title><br /></li><li></head></li></ol>
登录后复制


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

www.bkjia.comtruehttp://www.bkjia.com/PHPjc/1118876.htmlTechArticle移动端web头部header通用写法 1.head部分 通用写法;网上也有,不过有的可有有的可无;原理是兼容IOS透明栏目等问题,再者就是viewport(关键...
相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板