会员注册关闭
网页自适应解决iPhone苹果的safari浏览器手机横屏字体变大问题
作者:未知来源:网络收集
整理日期:2019-12-20
点击:717
文字大小:
在style.css中添加以下代码：
css 代码复制内容到剪贴板
- /*
- **修复iPhone横屏后字体变大
- */
- @media screen and (max-device-width: 320px){body{-webkit-text-size-adjust:100%}}
- @media screen and (max-device-width: 480px){body{-webkit-text-size-adjust:100%}}
- @media only screen and (-webkit-min-device-pixel-ratio: 2){body{-webkit-text-size-adjust:100%}}
- @media only screen and (min-device-width: 768px) and (max-device-width: 1024px){body{-webkit-text-size-adjust:100%}}
其中最重要的代码这个属性：
-webkit-text-size-adjust
“-webkit-text-size-adjust”是CSS3中的一个属性。这个属性，从字面上来看，就是“WebKit的文字大小调整”的意思。
什么是WebKit呢？
这是一种开源的浏览器引擎，而苹果的safari浏览器用的就是这种内核。其实chrome、Android的也是WebKit内核。
在WebKit内核的浏览器中规定，当在css中定义的中文font-size小于12px的时候,浏览器仍然使用12px。字体也会随着网页的变大而变大，这也是当你手机横屏时，字体变大的原因。而控制这个功能的，就是CSS 中的 -webkit-text-size-adjust。
text-size-adjust 设为 none 或者 100% 则关闭字体大小自动调整功能。
获得更多 -> 应用技巧 -> 常用技巧责任编辑: webmaster >>> 百度上搜索 谷歌上搜索
点击复制本连接 （http://www.hugesky.com/showarticle.php?id=6997）
token的作用及实现原理
在 iPhone 上使用 Safari 浏览器搜索网站| 【声明】： 以上文章或资料除注明为电脑技巧原创或编辑整理外，均为网络收集整理或网友推荐。以上内容以共享、参考、研究为目的，不存在任何商业目的。 未注明作者或出处的文章，可能资料来源不规范。如有涉及版权请给予及时联系更正或予以删除。 |
我问佛：如何才能如你般睿智？ 佛曰：佛是过来人，人是未来佛。
部分资源收集于互联网并遵循 署名-非商业性使用-相同方式共享3.0共享，尽量署名原创。
据《信息网络传播权保护条例》 如侵犯您的权利，请联系webmaster(at)hugesky.com删除。
Power By HugeSky.Com
Copyright© www.hugesky.com
Powered by HUGESKY CMS 7.1.1.1080918 professional licensed