ios - CSS媒体查询不适用于iPad横向模式

我有一个iPad，要在横向模式下在其中应用媒体查询。这就是我尝试过的（我都尝试过两种选择。）：

选项1：

/* iPads (landscape) ----------- */
@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) {
  .ipad-landscape { color: blue; } /* your css rules for ipad landscape */
}

选项2：

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* Styles */
}

当ipad处于横向模式时，上述媒体查询似乎不起作用。

在header.php文件中，我正在使用以下元属性：

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

问题陈述：

我想知道我应该对上述meta属性或媒体查询进行哪些更改，以便可以应用媒体查询
当ipad处于横向模式时。

最佳答案

我将您的CSS更改为以下代码：

/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
  /* Styles */
}

/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
  /* Styles */
}

关于ios - CSS媒体查询不适用于iPad横向模式，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/58013257/