在无序列表中为span添加样式

4
我买了一个带有选项卡(一种展开不同内容的菜单)的模板,我想更改列表内文本的颜色。每个选项卡都需要有不同的颜色。所以第一个是红色、第二个是蓝色、第三个是绿色,第四个是黄色。我尝试使用子元素、元素、类等方法,但没有结果。
以下是我尝试过的其中一段代码。

#one a
{
color:#e28844
}
<ul class='cmsms_tabs_list'>
  <li id="one" class="cmsms_tabs_list_item">
     <a href="#">
       <span>One</span>
      </a>
    </li>
  <li id="two" class="cmsms_tabs_list_item">
     <a href="#">
       <span>Two</span>
      </a>
    </li>
  <li id="three" class="cmsms_tabs_list_item">
     <a href="#">
       <span>Three</span>
      </a>
    </li>
  <li id="four" class="cmsms_tabs_list_item">
     <a href="#">
       <span>Four</span>
      </a>
    </li>
  </ul>


在模板中很奇怪,它没有出现。我知道你的意思。 - Jordy Senssen
模板可能有覆盖CSS代码。因此,您需要发布影响它的完整代码。 - m4n0
1个回答

3
您可以添加以下样式。
.cmsms_tabs_list li:nth-of-type(1) a span {
     color : red;
}

.cmsms_tabs_list li:nth-of-type(3) a span {
      color : blue;
}

.cmsms_tabs_list li:nth-of-type(4) a span {
      color : green;
}

.cmsms_tabs_list li:nth-of-type(2) a span {
      color : yellow;
}

供参考 - http://jsfiddle.net/s1s12w2x/1/

(此链接为技术相关内容)

1
这种方式不行,但是我将span放在后面就可以了!谢谢 - Jordy Senssen
太好了,它起作用了。我已经更新了答案,包括 span,但是对我来说没有 span 也可以工作。 - Nikhil Aggarwal

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接