0

我有一个主菜单,我在悬停状态下带有下划线。但是我不希望它出现在子菜单类别中。

这是我的代码:

#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; }
4

1 回答 1

0

我想你在问这个:

#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

于 2013-09-26T01:41:57.287 回答