Question

我很想让导航菜单在我的网页上正常工作。我像其他帖子中建议的那样使用HTML Tidy更正错误，然后输入我想要使用的导航栏的CSS代码。起初菜单根本没有显示，但我的布局仍然像以前一样。所以我再次做了HTML Tidy，看看是否需要清理HTML。当我这样做时，导航菜单DID显示，但我的布局都没有排序。我只是好奇，如果由于我的布局的性质，我想要我的导航菜单在图形横幅上方，如果这就是为什么它只是不工作，并且都是出于怪癖。

执行HTML Tidy并显示菜单后对页面执行的操作的示例：

http://veterinarycare.atspace.cc/index3.html

我的网页通常应该是什么样子的示例：

http://veterinarycare.atspace.cc

这非常令人发狂，因为我似乎无法弄明白。我试图使用似乎是一个非常简单的CSS导航菜单，它只是无法正常工作。有帮助吗？

Answer 1

您正在参与许多不良做法，这些做法根本无法通过整理您的HTML来解决。

我的快速扫描中最糟糕的罪犯是：

<div class="extra">
  <span><img src="images/header-img.png" class="png" alt=""></span>
</div>

.extra的命名惯例毫无意义，使用<span>是多余的，而.png类只是奇怪的。

您只需要学习更好的HTML / CSS实践，然后再试一次。阅读一些书籍，学习Twitter Bootstrap，并在遇到特定且明确定义的问题时依靠StackOverflow。

Answer 2

你的HTML非常错误

从css文件中删除此脚本并将其放在头部或单独的JS文件中

sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
    sfEls[i].onmouseover=function() {
        this.className+=" sfhover";
    }
    sfEls[i].onmouseout=function() {
        this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
    }
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

该脚本的目标是#nav，而html中没有id ='nav' 将您的导航包装在#nav div中..希望它可以正常工作

尽管使用HTML Tidy，导航菜单仍然无法正常工作

2 个答案: