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.