您已经见过无数次了
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About us</a></li>
<li><a href="#">Contact us</a></li>
</ul>经典的菜单 HTML，您可以通过 CSS 将其转换为无数美丽的事物。 您可以通过将其放入自己的 HTML 文件（例如“menu.html”）并在页面上使用类似于此 PHP 代码段的简单包含语句来将其包含在所有页面中
<?php include_once("menu.html"); ?>
现在您需要添加一个类，以便您可以向访问者指示他们在当前导航中的位置
<ul>
<li><a class="selected" href="#">Home</a></li>
<li><a href="#">About us</a></li>
<li><a href="#">Contact us</a></li>
</ul>选定的类可能会切换背景图片或加粗文本或其他内容以指示当前导航。 这很棒，但现在您已经为特定页面个性化了此代码块。 糟糕！ 我们破坏了使用包含语句的全部用处。 以这种方式执行会导致我们必须将此代码放在每个页面上并更改放置选定类的位置。
相反，让我们为每个菜单链接提供它自己的唯一类
<ul>
<li><a class="home" href="#">Home</a></li>
<li><a class="about" href="#">About us</a></li>
<li><a class="contact" href="#">Contact us</a></li>
</ul>这仍然没有给我们提供一种方法来单独挑选各个页面上的单个菜单项。 至少不是完全靠它自己……。
技巧来了
为页面上的每个 <body> 标签提供唯一的 ID。 例如 <body id=”home”> 然后您可以创建 CSS，当菜单链接类和 body ID 匹配时，该 CSS 仅会影响菜单项
#home .home, #about .about, #about .about, #contact .contact
{
Your CSS stylings here
}这是一个很好的例子，说明了 CSS 的美丽和效率。 感谢 Trenton Moss.
我无法理解这篇文章中的某些部分，这些部分是关于在所有页面上包含导航代码（即使有当前导航突出显示！），但我认为我只需要查看更多关于这方面的资源，因为它听起来很有趣。
嗨，Daniel，
这篇文章的主要内容是，您可以对不同页面的 body 元素使用唯一的 ID，然后仅根据匹配的 ID 和类在该页面上激活某些 CSS。 基本上，它有助于对抗冗余，因为您可以使用包含语句来包含导航，而不是在每个页面上重复它。
Trenton 可能会在他的文章中更好地解释它，该文章链接在页面底部（它是 #10）。
如果您还有其他问题，请随时与我们联系。
错字
class = “home”
应该是
id = “home”
很棒的小贴士。 我一直使用 PHP 并声明一个变量在顶部设置活动状态，但这更简单更有效。 我一定会使用这个。
非常有用。
谢谢