html - In CSS3 is "li:hover > a" and "li a:hover" the same -

is "li:hover > a" , "li a:hover" same

such in codes

ul#navigation li a:hover { background:#f8f8f8; color:#282828;} 

and

ul#navigation li:hover > { background:#fff;} 

not @ all, 2 different selectors.

 li a:hover 

means: apply rules a element, descendant of li element, when user puts mouse on former.

 li:hover > 

means: apply rules a element, direct child of li element, when user puts mouse on latter.

---

as can see, there several differences.

1. first of all, first selector apply rules anchor, when anchor hovered; means if have anchor element smaller parent list item, have put mouse on anchor trigger changes.
2. on other hand, second selector applies rule anchor, wherever mouse hovers on parent.
3. the second rule sports >, known direct descendant selector or child selector apply rules if a tag directly contained within li no intermediate containers.