带有无序列表的导航栏

Question

这个问题应该很简单，拿一个html类并在尝试完成一项任务时遇到这个问题。我制作了一个无序列表，使用CSS格式化我的导航栏，但现在我无法在页面上创建一个有序列表，因为我为导航栏做了格式化。

Answer 1

导航栏HTML应为：

<ul id="navbar">
    <li><a href="home.htm">Home</a></li>
    <li><a href="about.htm">About</a>/</li>
    <!-- ... -->
</ul>

CSS应该是：

ul#navbar {
    display:inline;
    /* Any other CSS you want */
}
ul#navbar li {
    display:inline;
}

然后CSS不会影响您创建的任何其他UL。

Answer 2

您需要编写通用列表样式，然后为导航栏覆盖它们：

ul { /* Basic UL styles here */ }

#main-navigation ul { /* Navigation menu styles here (assumes a container with ID 'main-navigation') */ }