仅对父级应用CSS，而不对子级应用CSS

我有一个像这样的无序列表：

<div class="list">
<ul>
    <li>
        list1
        <ul>
            <li>Sub list1</li>
            <li>Sub list2</li>
            <li>Sub list3</li>
        </ul>
    </li>
    <li>
        list2
        <ul>
            <li>Sub list1</li>
            <li>Sub list2</li>
            <li>Sub list3</li>
        </ul>
    </li>
</ul>
</div>

我现在只想对第一个列表应用 CSS，而不是其子列表ul and li。我已尝试以下操作：

.list ul li{
background:#ccc;
}

...但背景颜色适用于所有列表。应该怎样做才能只改变父级而不是子级的 CSS？

使用直接后代运算符>为了那个原因：

.list > ul > li { ... }

The >运算符仅选择其之前元素的直接子元素。

但请注意，该列表项内的任何内容当然都将具有列表项的背景，尽管没有直接为其分配任何背景颜色。