Комбинированная декларация CSS в wordpress

Question

В WordPress он использует li для объявления пункта меню, в чем разница между двумя объявлениями CSS #navigator > li и #navigator li?

Answer 1

На самом деле, это не В WordPress, но это поведение селектора CSS:

белое пространство является Descendant Selector, что, по определению

соответствует только те элементы, соответствующие второй селектор для который содержит элемент предка, соответствующий первому селектору. Селекторы потомков похожи на дочерние селекторы, но они не требуют, чтобы соотношение между согласованными элементами было строго parent-child.

В вашем случае #navigator li будет соответствовать всем li на любом вложенном уровне внутри #navigator.

Пример:

<ul id="#navigator"> 
    <li> <!-- this is selected --> 
     <div> 
      <ul> 
       <li> <!-- this is selected --> 

С другой стороны

> является Child Selector, что: только

матчей тех элементов, совпадающих с помощью второго селектора, которые являются прямыми потомками элементов, соответствующих первому.

В вашем случае #navigator > li будет соответствовать только li, которые являются прямым Чайлдсом из #navigator.

Пример:

<ul id="#navigator"> 
    <li> <!-- only this is selected --> 
     <div> 
      <ul> 
       <li> 

Answer 2

Различие между этими 2 является то, что селектор> (#navigator > li) означает немедленный ребенок и #navigator li означает, что все li, которые имеют в качестве предка #navigator.