Question

我希望能够悬停一个链接，而不是显示下面链接的顶部边框。如果你查看小提琴，你会看到我的意思。任何有关这方面的帮助将不胜感激。谢谢=）

这是我的CSS代码：

#homeMenu {background:#d7d7d7;; position:relative; height:400px; top:20px;}
#homeMenu a {
  display:block; 
  color:#5d5d5d; 
  font:14px Arial, Helvetica, sans-serif; 
  padding: 20px 0; 
  border-top: 1px solid #fff; 
  border-bottom:1px solid #d7d7d7; 
  text-indent:15px; 
  text-decoration:none;
  box-sizing:border-box;
      }
#homeMenu a:hover {background: #fff; color:#00694f; border-top:1px solid #00694f; border-bottom: 1px solid #00694f;}
#homeMenu a:first-child {border-top:1px solid #d7d7d7;}
#homeMenu a:first-child:hover {border-top:1px solid #00694f;}
#homeMenu a.active {background: #fff; color:#00694f; border-top:1px solid #00694f; border-bottom: 1px solid #00694f;}
#homeMenu span {position:absolute; right:15px;}

这是我的HTML：

<div id="homeMenu">
     <a href="#" class="homeMenuLink active" id="homelink1">What is a credit union <span>></span></a>
     <a href="#" class="homeMenuLink" id="homelink2">Open an Account <span>></span></a>
     <a href="#" class="homeMenuLink" id="homelink3">Calculators <span>></span></a>
     <a href="#" class="homeMenuLink" id="homelink4">News and Events <span>></span></a>
     <a href="#" class="homeMenuLink" id="homelink5">Online Payments <span>></span></a>
     <a href="#" class="homeMenuLink" id="homelink6">Online Appointments <span>></span></a>                
</div><!--homeMenu close-->

CSS垂直菜单 - 有边框悬停问题

0 个答案: