iOS 9 bug – css规则被忽略

前端之家收集整理的这篇文章主要介绍了iOS 9 bug – css规则被忽略前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
自从升级到iOS 9以来,我的Web应用程序已经改变了行为,现在显示所有内容的CSS样式显示:none和visibility:hidden. Safari和Chrome for iOS都可以看到这个“功能”.
相同的内容在Chrome,Firefox,Safari和IE for Windows以及 Android手机上都会隐藏(如预期).这个问题似乎与iOS相关,但我找不到任何有关它的信息.

我知道iOS 9有一个媒体查询错误(描述为herehere),但我也没有页面的响应性和缩放的问题.

还值得注意的是,我使用的是Twitter Bootstrap 3,它特别是在iOS中无法正常使用的隐藏类.

<div class="hidden">Hide me please</div>

为什么内容不隐藏?

更新

我已经做了fiddle进行测试.它包含两个隐藏的对象,但在这个简化版本中,只有一个失败.我预计在我的真实场景中都会失败,但是你无法获得所需的一切;

解决方法

我想这是相关的宽度bug经常报告关于IOS9可能看起来像Safari没有正确的帐户媒体查询.

可能的解决方法可能是在元视口中修复或添加这些值:

initial-scale=1.0001
minimum-scale=1.0001
maximum-scale=1.0001
user-scalable=no

不要在元视口中设置页面宽度!这只会导致更多的问题.

所有这一切都是这样的:

<Meta name="viewport" content="initial-scale=1.0001,minimum-scale=1.0001,maximum-scale=1.0001,user-scalable=no"/>

如果它工作,你可以设置一个javascript只是为IOS9 webkit添加一个特定的元视图.

猜你在找的iOS相关文章