Frage zum Wiki-Artikel „Dropdown-Menüs mit CSS gestalten“

[beatovich]

hallo

Hallo,

eine Frage. Was ist denn der Unterschied zwischen diesen beiden Schreibweisen.

nav ul {
  /* Weitere Angaben */
}

Matche jedes ul das irgendwo in einem nav element vorkommt

nav li {
  /* Weitere Angaben */
}
~~~

Matche jedes li das irgendwo in einem nav element vorkommt

nav, nav > ul {
  /* Weitere Angaben */
}

Matche jedes nav UND jedes ul welches direktes Kindelement von nav ist.

nav > ul > li {
  /* Weitere Angaben */
}

Matche jedes li welches direktes Kindelement von ul ist, welches direktes Kind von nav ist.

nav > ul > li > ul {
  /* Weitere Angaben */
}

Matche jedes ul Element welches direktes Kind von einem li Element ist welches direktes Kind von einem ul Element ist, welches direktes Kind von einem nav Element ist.

Was bewirken die ">"?

Es ist ein Selektor für direkte Nachfahren.