Question

我很难查明是什么阻止以下链接起作用。

我选择了一个随机链接（w3schools）来测试它，然后再将其与其意图联系起来。

我认为问题可能与CSS有关。

ul {
  font-family: 'Montserrat';
  font-size: 15px;
  color: #994f00;
}

#innerNav {
  /*adding a relative or absolute here will break sticky*/
  background-color: black;
  color: white;
  left: 0px;
  overflow: hidden;
  height: 1300px;
  width: 150px;
  z-index: -1;
  white-space: nowrap;
  list-style-type: none;
}

<!DOCTYPE html> <!-- HTML 5 -->
<html lang="en">
<body>
	<div class= 'wrapper'>
			<div id = 'innerNav'>
         <li>
           <ul><a href="https://www.w3schools.com/html/" target="_top">The Door</a></ul>
           <ul>Mr Pointy</ul>
           <ul>Block Rain</ul>
          </li>
      </div>
    </div>
</body>
</html>

但是即使我注释掉innerNav的最后一行，链接仍然无效（点击它不会打开任何东西）。

有什么想法吗？

我的git文件也是：

Portfolio

Answer 1

问题与链接无关，而且与z-index的{{1}}设置为-1的事实无关。因此，您使用#innerNav覆盖了导航。因此，只需从innerNav中完全删除z-index，或者将其设置为1。

PS这个标记是无效的，你可能想查找无序列表的正确标记，它应该如下：

.wrapper

由于某种原因，你将<ul> <li></li> <li></li> </ul>嵌套在<ul>内，但它应该是另一种方式。

简单的HTML链接不会工作

1 个答案: