html – 在webapp模式下,移动Safari中的视口META标记是否已损坏?

前端之家收集整理的这篇文章主要介绍了html – 在webapp模式下,移动Safari中的视口META标记是否已损坏?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

在使用Safari的iPad上,转到此页面
http://ifelse.org/projects/errors/viewport/test.html

这是来源:

Meta name="apple-mobile-web-app-capable" content="yes" />
        <Meta name="apple-mobile-web-app-status-bar-style" content="black" />
        <Meta name="viewport" content="width=1030" />
        

它应该看起来像这个图像,其中1030像素的视口在纵向模式下完全可见:

>点按书签图标()
>点按添加到主屏幕
>创建书签.打开书签,网页将以全屏模式在webapp模式下打开.

视口标记基本上被忽略.我已经尝试了一些变异起诉设备和混合像素值.没有.

所以…这是一个错误,还是一个功能

如果这是Apple的故意,它本质上意味着要正确开发漂亮的网页应用程序,您需要使用实际宽度为768px …?

最佳答案
它不是一个错误或一个功能,我不认为.但它真的很烦人.

从iOS4开始,移动safari完全忽略了web-app模式中的视口元标记.在常规移动野生动物园模式中,它将自动计算确保显式内容宽度映射到设备宽度所需的比例因子.在web-app模式下,它不再执行此操作,并始终使用scale = 1.0.因此,您必须切换到液体布局并在视口标记中设置width = device-width(这不是理想的).或者您必须使用UIWebView构建应用程序以恢复正常行为.

它显着打破了网络应用程序的功能,恕我直言.

原文链接:https://www.f2er.com/html/425727.html

猜你在找的HTML相关文章