Question

我有一个包含导航链接数组的文件，因此，如果我想在导航菜单中添加新链接，我可以在一个文件中执行此操作，而不必手动更改多个链接。但是，每个菜单链接（类别）需要不同的a：悬停颜色，但我当前的编码不起作用。

这是存储菜单项的文件，以及应该是a的颜色：多索引数组中的悬停颜色（一些留空）：

<?php

$CATEGORIES = array(
    array("culture", "#f9993c"),
    array("nature", "#59AF56"),
    array("science", "COLOUR"),
    array("society", "COLOUR"),
    array("technology", "COLOUR")
    );

?>

这是打印菜单项的文件：

<?php

$count_categories = count($CATEGORIES);
$incr_categories = 0;

while($incr_categories != $count_categories) {
    // Change main_right_sub a:hover
    echo "<style>#main_right_sub a:hover { color: ".$CATEGORIES[$incr_categories][1]."; } </style>";

    // Print Nav Items
    echo "<a href='category.php?cat?=".$CATEGORIES[$incr_categories][0]."'>".strtoupper($CATEGORIES[$incr_categories][0])."</a>";

    // Increment Count
    $incr_categories++;
    if ($incr_categories != $count_categories) {
        echo "&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;";
    }
}

?>

我猜你不能交换这样的风格，因为鼠标悬停时所有的链接都是“＃59AF56”，这很奇怪，因为这是多索引数组中的第二种颜色。任何帮助将不胜感激！

Answer 1

您可以在链接上将类别设置为CSS类，以便生成的链接如下所示：

<a href="category.php?cat=culture" class="culture">CULTURE</a>

然后使用必要的颜色为每个链接类定义CSS样式（通过在PHP代码中生成它们或通过在静态CSS文件中定义它们。例如，对于 culture 链接在上面的例子中：

#main_right_sub a.culture:hover
{
    color: #f9993c;
}

Answer 2

首先，css不会在您想到的每个元素之后加载，浏览器将使用对您的所有元素具有最高优先级的任何规则，您可以做的是使用内联CSS样式，但不幸的是:hover不是支持者，所以你的最后一招基本上是javascript

<a
   href="link.php"
   onMouseOver="this.style.color='#FFF'"
   onMouseOut="this.style.color='#000'"
>Text</a>

但最好的方法是毫无疑问是使用类，给每个colortheme一个类，并根据需要将这些类添加到所需的元素。

CSS / PHP更改悬停颜色链接

2 个答案: