applying css for only parent but not to children

Question

I have an unordered list like this:

    

        list1
        

            
Sub list1<         


        
                      

              相关标签:
       
      

Answer 1

Use the direct descendant operator > for that:

.list > ul > li { ... }

The > operator selects only elements that are direct children of the element(s) before it.

Note however, anything inside that list item will of course have the background of the list item despite not having any background color directly assigned to it.

Answer 2

Alternatively, you can now do:

li:not(li li) { background: #ccc; }

Answer 3

You can use the > operator for that, like this:

.list > ul > li{
  background:#ccc; 
}

Answer 4

The only way of doing this is like:

.List > ul > li { background-color: #ccc; }

If you want to apply only the bgcolor to the ul simply do:

.List > ul { background-color: #ccc; }

:)