添加border-bottom：1px solid #FF到懸停在CSS水平下拉菜單上的子菜單

Question

我似乎無法確定如何添加邊框底部：1px實體#FFF到所有子菜單項時徘徊？

#menu{ 
    padding:0; 
    margin:0; 
    position: fixed; 
    top: 30px; 
    left: 0px; 
    font-size: 8pt; 
} 
#menu ul{ 
    padding:0; 
    margin:0; 
} 
#menu li{ 
    position: relative; 
    float: left; 
    list-style: none; 
    margin: 0; 
    padding:0; 
} 

#menu li a{ 
    width:120px; 
    height: 20px; 
    display: block; 
    text-decoration:none; 
    line-height: 20px; 
    background-color: #A9BBD3; 
    color: #FFF; 
} 

#menu li a:hover{ 
    background-color: #446087; 
} 

#menu ul ul{ 
    position: absolute; 
    top: 20px; 
    visibility: hidden; 
} 
#menu ul ul li a { 
    width: 115px; 
    padding-left: 5px; 
} 
#menu ul li:hover ul{ 
    visibility:visible; 
} 
#menu > ul > li > a{ 
    text-align:center; 
} 

<div id="menu"> 
    <ul> 
     <li><a href="#nogo">File</a> 
     <ul> 
      <li><a href="#nogo">Save</a></li> 
      <li><a href="#nogo">Link 1-2</a></li> 
      <li><a href="#nogo">Link 1-3</a></li> 
     </ul> 
     </li> 
     <li><a href="#nogo">Edit</a> 
     <ul> 
     <li><a href="#nogo">Add</a></li> 
      <li><a href="#nogo">Delete</a></li> 
     </ul> 
     </li> 
     <li><a href="#nogo">Reports</a> 
     <ul> 
      <li><a href="#nogo">Link 3-1</a></li> 
      <li><a href="#nogo">Link 3-2</a></li> 
      <li><a href="#nogo">Link 3-3</a></li> 
     </ul> 
     </li> 
    </ul> 
</div> 

Answer 1

添加到您的CSS，看看是否這會有所幫助：

#menu UL LI> UL：懸停{ 底部邊框：1px的固體#FFF; }