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

标签 css

详情

  • 我想强制设置我的 <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;
}

结果

enter image description here

最佳答案

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

Demo

关于css - 如何强制将我的 `<a>` 的所有文本颜色设置为不同?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27844301/

相关文章:

html - 将带有伪前/后选择器样式的汉堡包导航居中

css - 在 IE9 平台预览中使用微软过滤器

html - JSF如何更改链接的对齐方式

AS3 的 CSS 选择器

html - 变换 : translateX causes text blur

html - Css 过渡延迟不适用于滚动条

html - Firefox+IE - 如何在表格单元格 div 中放置 100% 高度的 div

css - 内联表单域 : search box and button in jQuery-Mobile

ASP.NET MVC 中的 HTML

javascript - jQuery 切换动画与 element.forEach