android - android中方向改变的媒体查询

标签 android html webview orientation media-queries

我有一个网站,它是为由 Android 设备上的 webview 加载而创建的 所以基本上我所期望的是我要加载的网站将适合屏幕,即不应该有任何内容溢出页面并引入滚动

当您以纵向模式在 webview 中加载网站时,它加载正常,我的意思是一切就绪,没有任何溢出,图像大小正确,如果我在查看 webview 时将其更改为横向,一切仍然很酷,它仍然可以缩放并显示与纵向模式下相同的 View ,你只是在它周围增加了额外的空间。

但是,如果我先在横向模式下加载 webview,我网站的内容似乎在某种程度上被放大了,因为在横向模式下,你有额外的宽度,现在如果我把我的手机变成纵向,它是没有重新缩放我的网站内容,所以图片在纵向中太大,它迫使你向右滚动才能看到整个图片。

我试图避免你需要滚动才能看到内容的地方

是不是因为在旋转 webview 时,比如从横向到纵向,android 只是把横向模式下的任何东西都放在纵向模式下,而不尝试调整它的大小?

最佳答案

iOS 上有一个类似的错误,旋转设备会导致奇怪的页面缩放问题(有关详细信息,请参阅 https://github.com/scottjehl/Device-Bugs/issues/2)。我发现在 iOS 上解决这个问题的一个很好的方法是更改​​元视口(viewport)标签。看起来最常见的元视口(viewport)标签(并且用于 HTML5 样板)是这样的:

<meta name="viewport" content="width=device-width,initial-scale=1.0">

但是,通过删除 initial-scale=1.0,可以回避此错误(在 iOS 上):

<meta name="viewport" content="width=device-width">

但不确定此修复是否适用于 Android。

关于android - android中方向改变的媒体查询,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10631983/

相关文章:

java.lang.RuntimeException : writeValueXml: unable to write value 错误

android - 为 Android 调整 FontSizeToFitWidth

java - 我怎样才能实现一个简单的 AsyncTaskLoader?

html - 响应式背景中的绝对中心文本

ios - ios-在WkWebView中禁用Youtube自动播放

android - protected (DRM) 内容的 MediaProjection API

html - 使用 Bootstrap 将元素放在水平行和间距问题上

javascript - 单击更改后使用 id 显示 div

webview - 为什么在 super 应用程序中测试时 webview 显示 ‘no permission to load’ 错误?

html - 将Youtube视频嵌入HTML for iOS