使用伪元素和css3实现鼠标移入 下划线向两边展开的动画效果效果

Daming 2018-03-30
0条评论 831 次浏览
Daming 2018-03-300条评论 831 次浏览

给导航加一个鼠标移入后 下划线向两边展开的动画效果效果

.navbar-nav>li>a:after{

  content: "";
  width:0;
  height:2px;
  background-color: $baseColor;
  position:absolute;
  left:50%;
  bottom: 0;
  transition: all 0.5s ;

}


.navbar-nav>li>a:hover:after{
  left: 0;
  width: 100%;

}

1+

发表评论

电子邮件地址不会被公开。