Question

尝试使用html / css创建垂直下拉菜单。

据我所知，编码非常干净，并且在ff中运行良好，即（不是6 ofc），而歌剧虽然在谷歌浏览器和safari上，“toplink”在悬停时跳到左侧。

HTML：

<div id="topmenu">
<ul>
  <li class="toplink"><a href="about.html">About</a>
    <ul class="submenu"><li><a href="about2.html">About2</a></li>
                        <li><a href="about3.html">About3</a></li>
    </ul>
  </li>
  <li class="toplink"><a href="anotherdropdown.html">About</a>
    <ul class="submenu"><li><a href="about2.html">About2</a></li>
            <li><a href="about3.html">About3</a></li>
    </ul>
  </li>
</ul>

的CSS：

 #topmenu ul {margin: 0; padding: 0; list-style: none; width: 100%; }
 #topmenu ul li {position: relative; float: left; display: inline; }
 #topmenu ul li ul {position: absolute; display: none; margin-top: 4px;}
 #topmenu ul li ul li {position: relative; clear: left; }
 #topmenu ul li:hover ul {display: block; }

Answer 1

似乎我在这里问得太过忙了。

添加#topmenu ul li {display：block}似乎可以解决问题，但不太清楚为什么。

任何解释都会受到赞赏，否则希望这对其他人有用！

链接跳转悬停谷歌铬和野生动物园

1 个答案: