css - 如何强制将我的 `` 的所有文本颜色设置为不同？

Question

详情

• 我想强制设置我的 <a> 的所有文本颜色与众不同。
• 由于某些原因，它不会生效。

我尝试过的

<ul id="sticky" class="sticklr">
    <?php foreach(array_unique(array_values($continent)) as $continent_id){
        if($continent_id == 1 ){ $continent_name = "Europe" ; $continent_code = "EU" ;  
        }elseif ($continent_id == 2 ){ $continent_name = "Asia" ; $continent_code = "AS" ;    
        }elseif ($continent_id == 3 ){ $continent_name = "North America" ; $continent_code = "NA" ;    
        }elseif ($continent_id == 4 ){ $continent_name = "Oceania" ; $continent_code = "OC" ;   
        }elseif ($continent_id == 5 ){ $continent_name = "South America" ; $continent_code = "SA" ;   
        }else{  $continent_name = "Africa" ; $continent_code = "AF" ; }  ?>
        <li>
            <a href="#<?php echo $continent_name ?>" class="sticky-<?php echo $continent_code ?>">
            <?php echo $continent_name ?> | <?php echo $continent_code ?>
            </a>
        </li>
        <?php }?>
    </ul>

• 注意:路径是这样的:

  .sticklr > li > a .sticky- continent_code { //CSS代码； }

CSS

.sticklr > li > a .sticky-AS{

    color: orange !important;
    text-decoration: none !important;
}
.sticklr > li > a .sticky-EU{

    color: #50c0de !important;
    text-decoration: none !important;
}
.sticklr > li > a .sticky-NA{

    color: red !important;
    text-decoration: none !important;
}
.sticklr > li > a .sticky-OC{

    color: #428bca !important;
    text-decoration: none !important;
}
.sticklr > li > a .sticky-SA{

    color: #5cb85c !important;
    text-decoration: none !important;
}
.sticklr > li > a .sticky-AF{

    color: silver !important;
    text-decoration: none !important;
}

结果

Answer 1

采用 .sticklr > li > a ，它应该可以工作。

Demo