问

为什么来自父级的list-style-image会覆盖孩子的图像？

时尚潮_流早覀报_326 发布于 2023-01-18 10:02

这是我的HTML:


    
          Release 1 
        
              Core Additions 

                Done -- should be checked off
                Done
                Not Done
                Not Done

这是冲突的代码:

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

.workList > li > ul li {
    margin-left: 32px;
    margin-top: 5px;
    margin-bottom: 5px;
    list-style-image: url("..//images/checkBox.png");
}

workDone 是孩子 - 我把它放在前面,看看它被宣布的位置是否是问题.

.workList是一个无序的列表,.workDone是一个

由于某些原因,谷歌浏览器显示.workDone的checkMark.png被划掉,然后它继承了它的父母的图像......

的jsfiddle

为什么会这样？
有解决办法吗？

1 个回答

.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;
}

2023-01-18 10:05 回答

手机用户2602933165

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签