First Selector
ul.nav-menu
This first selector relates only to ul
elements with a class named nav-menu
. For example:
<ul class="nav-menu">
<li></li>
<li></li>
</ul>
Here it relates to the ul
element because it is simply a ul
with a class of nav-menu
.
Second Selector
div.nav-menu > ul
This second selector relates only to ul
elements that are direct children (directly below) div
elements with a class named nav-menu
. For example:
<div class="nav-menu">
<ul>
<li></li>
<li></li>
</ul>
</div>
Here it relates to the ul
within the div
because it is a ul
directly below the div
with a class of nav-menu
.