html - CSS类问题

Question

我目前在思考类和 id 选择器的想法时遇到了麻烦。下面发布的是我当前的导航标记。我想在我的 css 样式表中实现的是水平菜单。

为什么我不能针对.navigation-menu此类 ( .navigation-main) 中的所有内容设置样式？

<nav class="navigation-main">
    <ul class="menu">
        <li class"home"><a href="index.html">Home</a></li>
        <li class"submit"><a href="submit.html">Submit a Pic</a></li>
        <li class"advertise"><a href="advertise.html">Advertise</a></li>
        <li class"contact"><a href="contact.hml">Contact</a></li>
    </ul>
</nav>​

---

CSS

.navigation {
display:inline;

}

Answer 1

您没有针对以下元素：

.navigation-main li{
   display:inline;
}

Answer 2

您似乎对 CSS 选择器的工作方式感到困惑。一个类需要与它的定义相同的名称才能实际匹配。

HTML

<div class="my-class"></div>

CSS

.my-class
{
  ...
}

因此，要回答您的问题（目前是这样），为什么您不能.navigation-menu针对.navigation-main. 这是因为您的 CSS 类.navigation与当前 HTML 中的任何类都不匹配

使用以下方式设置您的资产净值class="navigation-main"：

CSS

.navigation-main 
{
  ...
}

class="menu"仅使用位于 NAV 内的 UL 设置样式class="navigation-main"：

CSS

.navigation-main .menu 
{
  ...
}

为NAV 中的所有元素设置样式class="navigation-main"

CSS

.navigation-main *
{
  display:inline;
}

Answer 3

根据问题，因为您将css应用于navigation未使用的类，您需要包含此类以应用css

尝试

 .navigation-main li {
    display:inline;
}

Answer 4

你正在寻找这个：

.menu li {display:inline;}