为什么我的CSS下拉菜单可在Android和所有PC浏览器上运行,而不能在iOS设备上运行?

.mainHeaderBtns ul li:hover > ul {
    display:block;
}

最佳答案

在我的测试中,对于下拉菜单,请确保<a href="#">元素在页面上可见且可单击,我做了一个简单的演示,它工作正常。

.nav > li > ul {
  display: none;
}
.nav > li:hover > ul {
  display: block;
}
<ul class="nav">
  <li>
    <a href="#">Menu item</a>
    <ul>
      <li>Sub item</li>
    </ul>
  </li>
</ul>


对于任何元素,Apple 1建议添加onclick = "void(0)",我也发现onclick="return false;"onclick=""都可以使用。

div span {
  display: none;
}
div:hover span {
  display: inline;
}
<div onclick="void(0)">Howdy <span>mates!</span></div>



1 https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html

10-05 20:44
查看更多