Question

基于wordpress Underscores主题，我遇到了响应式下拉菜单的问题。

它在桌面上看起来不错，但不适用于包含iPad和iPhone的iOS Safari。

我也尝试将z-index添加到其他div，但它不起作用。请帮我。感谢。

Answer 1

实际上有第四种方法，有translate3d：

-webkit-transform: translate3d(0,0,1px);
transform: translate3d(0,0,1px);

iOS浏览器完全支持CSS3，因此您可以安全地使用它。

Answer 2

有三种方法可以解决这个问题：
1.您可以将z-index值设置为80或90之类的大数字 2.您可以在其他div之后添加菜单元素（因此默认情况下它会放在其他项目上）
3.您可以将div中文本的z-index设置为小于菜单div的z-index。

Answer 3

您不能只将z-index应用于下拉菜单 - 您需要做的是将z-indicies应用于兄弟元素以确保正确的堆叠顺序。

如果没有看到您的HTML，就无法确定它们应该去哪里。但我能说的最好的是将z-index应用于整个导航栏，将一个z-index应用于整个内容div。请记住，正如Ajay所说，为了使z-indicies正常工作，它们所应用的元素必须非静态定位（在你的情况下：相对很可能是最佳选择）。

Answer 4

如果下拉菜单的父元素为nav，则应将z-index设为大数，高于其他元素

Answer 5

我在Safari iPhone / iPad上遇到了同样的问题，只有Fabien的解决方案解决了该问题：

-webkit-transform: translate3d(0,0,1px);
transform: translate3d(0,0,1px);