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

移动端web头部header通用写法

首页

后端开发

php教程

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

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jul 12, 2016 am 08:54 AM

android

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

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

热AI工具

Undresser.AI Undress

人工智能驱动的应用程序，用于创建逼真的裸体照片

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

免费脱衣服图片

Clothoff.io

AI脱衣机

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！

显示更多

热工具

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

中文版，非常好用

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

显示更多

热门话题

gmail邮箱登陆入口在哪里

7704

Java教程

1640

CakePHP 教程

1394

Laravel 教程

1288

PHP教程

1231

显示更多

Related knowledge

新报告对传闻中的三星 Galaxy S25、Galaxy S25 Plus 和 Galaxy S25 Ultra 相机升级进行了严厉的评估 Sep 12, 2024 pm 12:23 PM

最近几天，Ice Universe 不断披露有关 Galaxy S25 Ultra 的详细信息，人们普遍认为这款手机将是三星的下一款旗舰智能手机。除此之外，泄密者声称三星只计划升级一款相机

三星 Galaxy S25 Ultra 泄露了第一张渲染图，传闻中的设计变化被曝光 Sep 11, 2024 am 06:37 AM

OnLeaks 现在与 Android Headlines 合作，首次展示了 Galaxy S25 Ultra，几天前，他试图从他的 X（以前的 Twitter）粉丝那里筹集到 4,000 美元以上的资金，但失败了。对于上下文，嵌入在 h 下面的渲染图像

IFA 2024 | TCL 的 NXTPAPER 14 在性能上无法与 Galaxy Tab S10 Ultra 相媲美，但在尺寸上几乎可以与之媲美 Sep 07, 2024 am 06:35 AM

除了发布两款新智能手机外，TCL 还发布了一款名为 NXTPAPER 14 的新 Android 平板电脑，其大屏幕尺寸是其卖点之一。 NXTPAPER 14 采用 TCL 标志性品牌哑光液晶面板 3.0 版本

Vivo Y300 Pro 在 7.69 毫米纤薄机身中配备 6,500 mAh 电池 Sep 07, 2024 am 06:39 AM

Vivo Y300 Pro刚刚全面亮相，它是最薄的中端Android手机之一，配备大电池。准确来说，这款智能手机的厚度仅为 7.69 毫米，但配备了 6,500 mAh 的电池。这与最近推出的容量相同

三星 Galaxy S24 FE 预计将以低于预期的价格推出，有四种颜色和两种内存选项 Sep 12, 2024 pm 09:21 PM

三星尚未就何时更新其 Fan Edition (FE) 智能手机系列提供任何提示。目前来看，Galaxy S23 FE 仍然是该公司的最新版本，于 2023 年 10 月年初推出。

新报告对传闻中的三星 Galaxy S25、Galaxy S25 Plus 和 Galaxy S25 Ultra 相机升级进行了严厉的评估 Sep 12, 2024 pm 12:22 PM

小米红米 Note 14 Pro Plus 上市，成为首款配备 Light Hunter 800 摄像头的高通 Snapdragon 7s Gen 3 智能手机 Sep 27, 2024 am 06:23 AM

Redmi Note 14 Pro Plus 现已正式成为去年 Redmi Note 13 Pro Plus 的直接后继产品（亚马逊售价 375 美元）。正如预期的那样，Redmi Note 14 Pro Plus与Redmi Note 14和Redmi Note 14 Pro一起成为Redmi Note 14系列的主角。李