Html 如何将网页方向修复为仅适用于 iPad 和 iPhone 的纵向?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8036167/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 11:24:49  来源:igfitidea点击:

How can I fix the webpage orientation to Portrait only for iPad and iPhone?

iphonehtmlcssipadmeta-tags

提问by Digital Robot Gorilla

I have developed a web app/website for the iPad but I can not get it stay in a fixed portrait view only.

我已经为 iPad 开发了一个网络应用程序/网站,但我无法让它只停留在固定的纵向视图中。

I do not want it to rotate and work in landscape mode, because of the way the app has been designed.

由于应用程序的设计方式,我不希望它在横向模式下旋转和工作。

I've tried various configurations of the viewport settings but that still has not worked.

我已经尝试了视口设置的各种配置,但仍然没有奏效。

I'm not very good at JavaScript so a copy paste option would be best or something in CSS/HTML.

我不太擅长 JavaScript,所以最好使用复制粘贴选项或 CSS/HTML 中的某些内容。

Thanks in advance.

提前致谢。

回答by DaGaMs

Unfortunately, there is no way to explicitly "lock" the orientation of a web-app in Mobile Safari, as you can also see from the link that Alex posted above in the comment:

不幸的是,没有办法在 Mobile Safari 中明确“锁定”网络应用程序的方向,正如您还可以从 Alex 在上面评论中发布的链接中看到的:

How do I lock the orientation to portrait mode in a iPhone Web Application?

如何在 iPhone Web 应用程序中将方向锁定为纵向模式?

However, you can have multiple CSS files for different screen orientations. There's a handy JavaScript snippet that you can copy-paste here:

但是,您可以为不同的屏幕方向设置多个 CSS 文件。有一个方便的 JavaScript 片段,您可以在这里复制粘贴:

http://www.catswhocode.com/blog/10-useful-code-snippets-to-develop-iphone-friendly-websites

http://www.catswhocode.com/blog/10-useful-code-snippets-to-develop-iphone-friendly-websites

This should at least allow you to design around the rotation without having to use JS but just CSS.

这至少应该允许您围绕旋转进行设计,而不必使用 JS 而只使用 CSS。