css - 缩小 Ionic >=2 警报的媒体查询在 IOS 上不起作用

Question

我发现 Ionic alert当我们进入 landscape 时，它似乎没有调整它的高度，所以如果我有很多选项，如果在大多数手机上进入横向，它就太高了。

为了解决这个问题，我添加了以下媒体查询...

    @media screen and (max-height: 350px) {
          .alert-md .alert-radio-group,
          .alert-md .alert-checkbox-group {
            max-height: 140px;
          }
      }

这似乎在 Android 上运行良好，但在 iOS 上根本行不通。我已经在 Safari 中查看了设备上运行的应用程序，并且可以看到有问题的元素确实应用了 alert-radio-group，但我没有看到应用了媒体查询(并且它有原来的高度太高了)

Ionic 应用视口(viewport)设置为

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

根据其他帖子看起来是正确的。

此外，我对横向模式 中的宽度和高度感到有些困惑(宽度和高度是否互换，所以宽度现在是最长的边，我假设是这样)。无论如何，它适用于 Android。

有没有人知道为什么这在 iOS (>= 10) 上不起作用，或者可能是自动调整警告框大小的更好方法。

提前感谢您的任何建议!

Answer 1

您正在使用 android 特定类 alert-md。在 ios 的情况下，生成的类将是 alert-ios

@media screen and (max-height: 350px) {
      .alert-md .alert-radio-group,
      .alert-md .alert-checkbox-group,
      .alert-ios .alert-radio-group,
      .alert-ios .alert-checkbox-group {
        max-height: 140px;
      }
  }