当容器小于设备宽度

时间:2015-12-15 03:40:30

标签: android ipad ios9 viewport

我有一个小的webview(大约75px高),显示html内容,头部包含以下元数据:

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

此html将显示在Android手机,Android上的网页浏览量中 平板电脑,iPhone和iPad。

在手机设备(Android手机/ iPhone)上,webview容器宽度与设备宽度相同,因此上述视口元数据标签似乎正常工作。

但在平板电脑设备(Android平板电脑/ iPad)上,webview容器宽度将是动态的,因此有时webview容器宽度将小于设备宽度。

这意味着在平板电脑上,只要webview容器宽度小于设备宽度,就会裁剪html内容

然而,在将元数据更改为

之后
<meta name="viewport" content="width=50, initial-scale=1" />

<meta name="viewport" content="width=500, initial-scale=1" />

我发现使用iOS9的Android和iPhone / iPad上实际上会忽略元数据。这意味着内容将在所有这些设备上进行调整并按预期显示。我只能在iOS9之前的iPad上看到这个问题。

我已尝试删除视口元数据标记,并且我还尝试使用以下元数据标记

<meta name="viewport" content="width=100%, initial-scale=1" />

并且两者都运行良好,但我想知道是否有更清洁的解决方案,因为我建议不要更改或删除我当前使用的视口元数据。

0 个答案:

没有答案