如何更改当前打开的链接的文本颜色，并保持未打开链接的默认颜色?这样用户就可以知道他现在在哪个链接上

how to change the text color of currently open link and remain default color of unopened link?so user gets an idea on which link he is currently on

本文关键字：链接 颜色 就可以 用户 文本 何更改 默认      更新时间：2023-09-26

我想更改活动文本的颜色。。以便用户知道他使用的是哪个页面。。。。例如，我们有两个主页和ABOUT页面的hyberlink。。我希望当我点击主页链接时，它的颜色会发生变化（即绿色），其他菜单项如ABOUT将保持默认颜色（即红色）。。当我点击关于菜单时，它的文本应该会改变（即绿色），ASLO主页菜单将保持其默认颜色（即红色），我想把这个放在wordpress的侧边栏上（带文本插件/小部件），我在那里给出了两个不同页面的超链接，所以如果它能得到HTML和CSS代码或任何其他建议，我会更好希望你们能理解我的问题，提前感谢你们的帮助，等待积极的回应，谢谢

查看CSS选择器:active、:hover、:link和:visited。

  • :active选择活动链接并设置其样式
  • :hover在用户悬停在链接上的情况下选择并设置链接样式
  • :link选择尚未访问的链接并设置其样式
  • :visited选择已访问的链接并设置其样式

:hover选择器必须覆盖在:link和:visited选择器之后。此外，:active选择器必须位于:hover选择器之后。

你可以这样使用：

a:link {
    color: red;
}
a:visited {
    color: green;
}
a:hover {
    color: blue;
}
a:active {
    color: yellow;
}

查看这篇文章：http://www.w3schools.com/css/css_link.asp

我不确定Wordpress是如何做到的，但一般来说，当你必须使用php时，这就是你可以做到的

对于每个页面，您都定义了一个包含页面名称的变量，例如，在about页面中，您定义了类似的内容

<?php $page = "about"; ?>

在主页上你会看到

<?php $page = "home"; ?>

然后在导航中检查$page的值，并为链接回显一个"活动"类名。我希望这能解释它：

<li><a href="home.php" class="<?php $page == "home" ? "active" : "" ?>">Home</a></li>
<li><a href="about.php" class="<?php $page == "about" ? "active" : "" ?>">About</a></li>

它的作用是：检查页面中声明的$page变量的值，如果值匹配，则向锚点标记添加一个"活动"类，否则将类名留空。

然后在您的CSS中，您将拥有类.active的样式，例如：

.active{ color: green; }

重点是，您需要确保"当前"页面的锚点有一个类（通常是"活动"或"当前"类，但您可以根据需要为其命名），然后使用php检查页面的名称，如我上面提到的，然后将该类名添加到锚点（或列表项，任何对您有用的）。

我不确定你在Wordpress中会如何做到这一点，但也许你可以使用上面的技术，并以某种方式进行定制以满足你的需求。（就像如果它是你制作的自定义小部件，你可以使用它）

希望能有所帮助。

相关文章：