jquery - CSS问题-元素仅在没有父元素时才有效(使用jquery)

我有这个密码：
CSS:

.taglist
{
    float:left;
    margin-left:30px;
}
.taglist ul
{
    overflow:auto;
    list-style-type:none;
    border:1px solid #999;
    background:#ccc;
    padding:20px;
    min-height:150px;
    max-height:150px;
    width:100px;
}

.taglist li
{
    display:block;
    border:1px solid #999;
    background:#fff;
    width:80px;
    padding:5px 10px;
    margin-bottom:5px;
}
.tag_selected {
    background:#ffc;
}

HTML格式：

<div class="taglist">
    <ul id="list1">
        <li id="1">1</li>
    </ul>
</div>

现在我用jQuery来做这个。。因此，当选择列表中的某个项时，它应该将其类更改为tag_selected。
问题是，它只在删除ul和li css之前的“.taglist”时才起作用，我不想这样做，因为我希望样式只在“taglist”div上。。
我试过每一种组合，比如“.taglist tag_selected”、“.taglist ul li tg_selected”等等，但都没用！!
我能做什么？
顺便说一句，试试这句话：

<li class="tag_selected" id="1">1</li>

结果是一样的，从来没有改变过。。
提前谢谢！

最佳答案

你的问题似乎是CSS选择器的特殊性。
规则.taglist ul和.taglist li比.tag_selected更具体，因此您的类被分配，但背景被.taglist li覆盖。
这应该管用

.taglist li.tag_selected {
    background:#ffc;
}

特殊性顺序（从最弱到最强）标记，类，ID。最容易记住的计算方法是把每一个的和看作一个数字，标记为1，类为10，ID为100。
li-1个
.taglist-10个
.taglist li-11个
li#myId-101个
div.taglist li.tag_selected-22个
请参见http://htmldog.com/guides/cssadvanced/specificity/以获取帮助或Google“css specification”。

关于jquery - CSS问题-元素仅在没有父元素时才有效(使用jquery)，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/4330423/