Наведение стиля только для отображения в главном меню не подменю?

Question

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

Это мой код:

#menu_container { padding: 0px 0; text-align: center; } 
#menu_container a:hover{background: url("/main/nav.gif") repeat-x scroll 0px 20px transparent;} 
#menu_container ul { list-style-type: none; margin: 0; padding: 0; text-align: center; } 
#menu_container ul li { margin-left: 15px; font-family: 'Lato', sans-serif; font-weight: 900; font-size: 1.2em; color: #000; position: relative; padding-bottom: 10px; text-transform: uppercase; display: inline-block; letter-spacing:1px; } 
#menu_container ul li:first-child { margin-left: 0; } 
#menu_container ul li a { color: #000; text-decoration: none; display:inline-block; padding-bottom: 5px; padding:10px; border-radius: 0px;} 
#menu_container ul li a:hover { color: #000; -webkit-transition: background 0.5sease;-moz-transition: background 0.5sease;-ms-transition: background 0.5sease;-o-transition: background 0.5sease;transition: background 0.5sease;} 
#menu_container ul li.current-menu-item a, 
#menu_container ul li.current_page_item a { color: #b9b9b9;} 
#menu_container ul li ul { position: absolute; top: 35px; left: 0; padding: 1px 1px; z-index: 25; display: none; border-radius: 3px; text-align: left; } 

Answer 1

Я думаю, что вы просите за это:

#menu_container ul li a { text-decoration: none; ...} 
#menu_container ul li a:hover { text-decoration: underline; ... }  
#menu_container ul li li a:hover { text-decoration: none; ... } /* no hover underline on sublinks */ 

Основная идея заключается в том Селектор специфичностью. Конкретный контекстный селектор (#menu_container ul li li a) перезаписывает более общее определение (#menu_container ul li a).

См схему приоритетов CSS:
http://en.wikipedia.org/wiki/Cascading_Style_Sheets#CSS_Priority_scheme_.28highest_to_lowest.29