Question

如果我在导航栏的无序列表中设置样式字体颜色，我怎样才能在特定元素上使用.class进行操作？

例如，这是我的导航：
主
服务
关于
联系我们

因此我在CSS中设置了导航字体颜色为＃000。

现在，如果我想将一个元素作为一个特定颜色搭配上课，我该怎么办？因为我尝试在其中一个上使用一个类，但它不会超过它。

Answer 1

如果每个元素都在他们自己的li下，你可以设置其中一个这样的li li class =＆＃34; home＆＃34; Home li和in css put .home {color：＃000}如果我正确地阅读了这个问题，这应该会有所帮助，如果不是抱歉我是新手。我会用代码编写它，但仍然需要熟悉这个网站。

Answer 2

您可以使用：active pseudo element。

如果你的HTML是：

<nav>
    <ul>
        <li><a href="home.html">Home</a></li>
        <li><a href="/services">Services</a></li>
        <li><a href="/about">About</a></li>
        <li><a href="/contact">Contact</a></li>
    </ul>
</nav>

您可以使用CSS执行此操作：

nav a {
    color: #000;
    font-size: 14px;
    font-weight: 600;
}

nav a:hover {
    color: #3e82f7;
}

nav a:active {
    color: #db4437;
}

nav a:visited {
    color: #ffeb3b;
}

如果您尝试指明用户所在的页面，您可能希望按以下方式构建HTML：

<nav>
    <ul>
        <li><a class="current-page" href="home.html">Home</a></li>
        <li><a href="/services">Services</a></li>
        <li><a href="/about">About</a></li>
        <li><a href="/contact">Contact</a></li>
    </ul>
</nav>

你的CSS：

nav a {
    color: #000;
    font-size: 14px;
    font-weight: 600;
}
.current-page {
    color: #3e82f7;
}

需要帮助样式活动链接

2 个答案: