无法获取CSS下拉导航仅在主页上查看内容

Question

我的主页上只有菜单问题。

当我将鼠标悬停在“替换部件”类别上时，下拉菜单会完美地覆盖滑块，但不会覆盖文本内容。我无法弄清楚如何修复CSS。

请帮忙！

https://www.trampolineandparts.co.uk/

谢谢

Answer 1

您需要修改以下内容：

body.cms-home .main-container {
    padding: 0px;
    z-index: 10000;  /*remove this*/
}

z-index main-container将其堆叠顺序设置为高于下拉菜单。

乍一看，您似乎不需要在此处定义z-index。所以继续把它删除。

您似乎在代码中经常使用z-index。不知道为什么会这样 - 除非您处理复杂的布局，否则通常不需要更改它。

查看MDN documentation或W3Schools：

  

z-index属性指定元素的堆栈顺序。

     

堆栈顺序较大的元素始终位于堆栈顺序较低的元素前面。

     

注意： z-index仅适用于定位元素（位置：绝对，位置：相对或位置：固定）。

此外，您可能应该考虑使用框架，因为这样可以更轻松地管理您的布局。例如Bootstrap。祝你好运。