移动端web头部header通用写法_PHP教程-php教程-PHP中文网

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

php中文网

发布： 2016-07-12 08:54:45

原创

1589人浏览过

法语写作助手

法语助手旗下的AI智能写作平台，支持语法、拼写自动纠错，一键改写、润色你的法语作文。

查看详情

移动端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

大家都在看：

Android访问本地PHP页面失败：浏览器或内容类型问题如何解决？ Android访问本地PHP页面时，PhpStorm提示错误对话框该怎么办？ Android访问本地PHP页面报错：JSON数据被浏览器当文件下载怎么办？ Android访问本地PHP页面报错：如何解决JSON数据显示问题？ Android访问本地PHP页面返回JSON数据时遇到问题怎么办？