Question

我在索引页中使用了nav标签，也想在第二页中使用它，但我只想保留一个相同的CSS文件。现在的问题是，如果我要在第二页的CSS文件中更改.nav样式，则它将在索引页中更改。我应该为每个页面制作单独的CSS文件，还是还有其他解决方案？

我试图在第二个html页面中给nav赋予id，以使其在css文件中有所不同，但是在第二个页面中导航并没有改变。

一二三

应该在第二页中进行更改。

Answer 1

您可以将一个类添加到您的元素中，并引用该特定类。例如：

<nav class="nav-style-1">...</nav>
<nav class="nav-style-2">...</nav>


.nav-style-1 { your styles ... }
.nav-style-2 { your styles ... }

希望有帮助！

Answer 2

我的建议是，如果要继续使用相同的CSS文件，则可以向每个导航栏添加id属性，并使用id为它们提供特定的CSS属性。

Answer 3

从事wordpress主题的人们与您有相同的要求。他们的解决方案是在body元素上添加一个id标签。

他们的CSS规则看起来像...

#page1 .nav {
 ...  your nav css rules for page 1 ...
}
#page2 .page2 {
... add a style to all items on page two with the class of page2.
}
#page3 .page3 {
... custom style that appears only on page3 ...
}

HTML

<body id="page1">

<!-- menu -->
<ul class="menu">
<li class="homepage">
<li class="page1">
<li class="page2">
<li class="page3">
</ul>

规则[＃page1 .page1]仅在.page1为a和＃page1中的元素（仅在page1上出现）时才有效。因此，我可以突出显示与所加载页面相对应的菜单项。

如何在多个页面中使用<nav>标记

3 个答案: