The first menu has class names on each menu item, allowing easy targeting for different colors on each item. This is possibly the simplest solution if creating a static HTML site.

However, if the menu was generated dynamically, using something like WordPress, you may not have the ability to easily add class names to each menu item. You need to target the menu items based on their position in the menu. One solution is using one of the CSS3 psuedo-selectors: nth-child. However, these don't work in IE8 and below.

A solution that will work in IE7 and IE8 (but not IE6) will is to use the "adjacent sibling" selector. To target the 2nd menu item use "li+li". To target the 3rd menu item "li+li+li". See the article for full description of how this works.