使用html和css的导航栏不可点击

Question

我正在创建一个网站，我想用 CSS 创建一个导航栏。但是，导航栏不可点击。这是用 HTML 和 CSS 制作的。

包含导航栏的 HTML 代码：

<link rel="stylesheet" type="text/css" href="style.css">

<ul id=navlist><li class=active> Home </li>
<li> <a title="LINK: My Youtube videos” href="youtubevideosch9changes.html”> My Youtube videos </a> </li>
<li> <a title="LINK: My Flash games” href="gamesch9changes.html> My Flash games </a> </li>
<li> <a title="LINK: Rants and articles” href="Rantsandarticles.html”> Rants and articles </a> 


</li>
</ul>

Answer 1

用此

"

标记结尾检查您的 HTML 代码。您使用了左双引号，而不是右双引号。将

"LINK: My Youtube videos”

更改为

"LINK: My Youtube videos"

。

使用以下代码，

<link rel="stylesheet" type="text/css" href="style.css">

<ul id=navlist><li class=active> Home </li>
<li> <a title="LINK: My Youtube videos" href="youtubevideosch9changes.html"> My Youtube videos </a> </li>
<li> <a title="LINK: My Flash games" href="gamesch9changes.html"> My Flash games </a> </li>
<li> <a title="LINK: Rants and articles" href="Rantsandarticles.html"> Rants and articles </a> 


</li>
</ul> 

Answer 2

检查 z 索引和定位： 确保导航栏（、

、元素）不位于可能覆盖它的其他元素后面。如有必要，使用 CSS z-index 调整堆叠顺序。

检查元素是否重叠： 使用浏览器开发人员工具检查页面，查看其他元素（例如定位容器或背景图像）是否与导航栏重叠，从而导致其无法单击。

检查重叠的透明元素： 验证是否有任何透明或半透明元素覆盖了导航栏，这可能会阻止点击注册。调整这些元素的CSS样式以确保它们不会干扰导航栏。

检查CSS指针事件属性： 检查父元素或覆盖元素是否有指针事件：无；在 CSS 中设置，因为这可以防止元素接收鼠标事件，包括单击。

确保标签结构正确： 仔细检查每个导航项 (

) 是否包含一个带有指向目的地的有效 href 属性的标签。确保标签正确嵌套在

标签内。

检查 JavaScript 事件监听器： 检查导航项或其父元素是否附加了 JavaScript 事件侦听器。确保它们不会阻止默认行为或停止单击事件的传播，这可能会禁用导航。

检查 CSS 显示和可见性属性： 通过 CSS 验证导航元素是否可见（显示：块；或类似）且不隐藏（显示：无；或可见性：隐藏；），因为隐藏元素不可点击。

检查控制台是否有错误： 打开浏览器的开发人员控制台（F12 或右键单击并检查元素 -> 控制台选项卡）以检查是否有任何可能影响导航栏功能的 JavaScript 错误。

我想这会对你有帮助