Html 为什么来自父对象的列表样式图像会覆盖子对象的图像？

这是我的HTML：

<ul id="todoList" class="workList">
    <li>
         <h2 class="collapse"> Release 1</h2> 
        <ul>
            <ul> <strong> Core Additions </strong>

                <li class="workDone">Done -- should be checked off</li>
                <li class="workDone">Done</li>
                <li>Not Done</li>
                <li>Not Done</li>
            </ul>
        </ul>
    </li>
</ul>

workDone就是那个孩子——我把它放在前面，看看它所声明的位置是否有问题

.workList是一个未排序的列表，而.WorkOne是一个

出于某种原因，google chrome显示.workDone的checkMark.png被删除，然后它继承了其父图像

为什么会这样？ 是否有变通/解决方案

.workList > li > ul  li

是比CSS选择器更具体的CSS选择器

.workDone

如果我理解正确，您正在寻找：

.workList > li > ul  li.workDone
{
    color: #A0A0A0 ;
    font-weight: lighter;
    list-style: none;
    list-style-image: url("..//images/checkMark.png") ;
    margin-left: 20px;
}

是比CSS选择器更具体的CSS选择器

.workDone

如果我理解正确，您正在寻找：

.workList > li > ul  li.workDone
{
    color: #A0A0A0 ;
    font-weight: lighter;
    list-style: none;
    list-style-image: url("..//images/checkMark.png") ;
    margin-left: 20px;
}

---

请发布相关的HTML，以使您应用此CSS的结构非常清晰。请尝试使用.workDone>li。顺便说一句，没有小提琴也帮不了你多少。@FrançoisWahl它是用javascript ajax生成的。。。我将尽我所能发布一个JSFIDLE。@Lemony Andrew:当相关HTML出现在页面中时，在ajax调用之后，打开调试器控制台，或者右键单击页面中的元素，然后单击Inspect元素。在调试器的“元素”选项卡上，您可以在生成时看到感兴趣的实际标记。你可以把它复制粘贴到你的问题中。@FrançoisWahl，谢谢你的时间-我做了，但我必须把它清理干净。不过，我想JSFIDLE可以帮我整理一下。。哎呀。我现在刚刚发布了这篇文章。请发布相关的HTML，以使您应用此CSS的结构非常清晰。尝试使用.workDone>li。顺便说一句，没有小提琴也帮不了你多少。@FrançoisWahl它是用javascript ajax生成的。。。我将尽我所能发布一个JSFIDLE。@Lemony Andrew:当相关HTML出现在页面中时，在ajax调用之后，打开调试器控制台，或者右键单击页面中的元素，然后单击Inspect元素。在调试器的“元素”选项卡上，您可以在生成时看到感兴趣的实际标记。你可以把它复制粘贴到你的问题中。@FrançoisWahl，谢谢你的时间-我做了，但我必须把它清理干净。不过，我想JSFIDLE可以帮我整理一下。。哎呀。我刚刚发布了小提琴。是的！事实上，我刚刚找到了一个相关建议的解决方案。。。我想我应该删除这个问题。@Lemony Andrew:不需要删除这个问题，因为它可能对将来有类似问题的用户有用。是的！事实上，我刚刚找到了一个相关建议的解决方案。。。我想我应该删除这个问题。@Lemony Andrew:不需要删除这个问题，因为它可能对将来有类似问题的用户有用。