Question

我试图找出为什么我的下拉菜单无效。

这是我正在处理的页面：http://www.privateservercloud.com/

如果您将鼠标悬停在＆＃34;管理广告系列＆＃34;的左侧区域你应该看到＆＃34; SEO Dashboard＆＃34;出现在下拉菜单中。

当我添加了我无法弄清楚的下拉菜单时，发生了3件事情。

＆＃34; SEO仪表板＆＃34;当li应该在最左边时，链接被推到右边。
＆＃34; SEO仪表板＆＃34;文字完全消失，除非你将鼠标悬停在它上面。
下拉菜单中有黑色方块，不会出现在我在其他网站上使用...

当我添加下拉菜单时，有人能看到会导致这些事情发生的原因吗？

编辑：除＃1外，其他任何内容似乎都已修复。＆＃34; SEO仪表板＆＃34;链接应该在最左边，但似乎仍然没有工作......

Answer 1

首先，如果您发布相关的html和CSS，那么以后查看此问题的人会更有帮助。既然你没有这样做，我会在这里做：

<ul class="nav" style="width: 158px; left: 156px; visibility: hidden;">
  <li><a href="https://mywebsite.com" class="subfoldericon">SEO Dashboard</a>
    <ul style="margin-left: 1px; width: 185px; left: 156px; visibility: hidden;">
        <li style="width:185px"><a href="test.php"><span style="width:241px">Test Menu</span></a></li>
        <li style="width:185px"><a href="test.php"><span style="width:241px">Test Menu</span></a></li>
        <li style="width:185px"><a href="test.php"><span style="width:241px">Test Menu</span></a></li>
        <li style="width:185px"><a href="test.php"><span style="width:241px">Test Menu</span></a></li>
    </ul>
  </li>
</ul>

问题是您正在对左侧定位进行硬编码。如果删除它，列表项将正确浮动。

Answer 2

要随时出现“SEO Dashboard”，只需添加“visibility：visible;”选择器“.navbar .nav＆gt; li＆gt; a”中的style.css第66行。这是因为ul.nav隐藏了可见性，并且li获得了这个属性，因为ul是它的父级。
添加“text-align：left;”到您的样式行148，以便在下拉菜单中将文本对齐到左侧。
添加“list-style-type：none;”你的style.css第139行选择器“.menu ul li ul li”删除黑色方块。

Answer 3

我将在下面解决每个问题：

1.当“li应该在最左边”时，“SEO仪表板”链接被推到右侧。

所有.navbar .nav元素的内联样式均为left:156px;。删除它，您的链接将正确显示

2.“SEO仪表板”文字完全消失，除非你将鼠标悬停在它上面。

您的第一个.navbar .nav元素的内联样式为visibility:hidden;。删除它，您的链接将正确显示。

3.下拉菜单中有黑色方块，不会出现在我正在使用的其他网站上...

如果您将list-style:none:添加到.menu ul li ul li元素，这可以解决您的问题。

下拉菜单无法使用CSS或Javascript？

3 个答案: