• 欢迎访问搞代码网站,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站!
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏搞代码吧

iphone6等移动端的css自适应

php 搞代码 4年前 (2022-01-22) 15次浏览 已收录 0个评论

关键是
<meta name="viewport" content="width=320,maximum-scale=1.3,user-scalable=no">

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=320,maximum-scale=1.3,user-scalable=no"></head><style type="text/css">html{font-size:100px;}body{font-size:0.14rem/*实际相当于14px*/}@media(min-device-width:375px)and(max-device-width:667px)and(-webkit-min-device-pixel-ratio:2){html{font-size:117.1875px;}}/*iphone6plus*/@media(min-device-width:414px)and(max-device-width:736px)and(-webkit-min-device-pixel-ratio:3){html{font-size:129.375px;}}</style><script type="text/javascript">(function(doc,<strong>+本文来源gao@daima#com搞(%代@#码网</strong><pre>搞代gaodaima码

win){var docEl=doc.documentElement,resizeEvt="onorientationchange" in window ? "orientationchange" : "resize",recalc=function(){console.log(resizeEvt);var clientWidth=docEl.clientWidth;if(!clientWidth)return;docEl.style.fontSize=100*(clientWidth/320)+'px';};//AbortifbrowserdoesnotsupportaddEventListenerif(!doc.addEventListener)return;win.addEventListener(resizeEvt,recalc,false);doc.addEventListener('DOMContentLoaded',recalc,false);})(document,window);</script><body>hello</body></html>


搞代码网(gaodaima.com)提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected],我们会在看到邮件的第一时间内为您处理,或直接联系QQ:872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:iphone6等移动端的css自适应
喜欢 (0)
[搞代码]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址