Question

我想知道这些导航栏下面是否有一个带有纯色条纹的术语，并在悬停时动画。我觉得很高兴看到它。

目前正在使用：https://steelseries.com/ http://prntscr.com/bvaz2u

它使用任何Javascript吗？创建起来容易吗？

Answer 1

即使这是重复的，这里只是一个CSS解决方案：

.navbar {
  max-height: 50px;
}

.navbar-nav>li:after {
  content: '';
  display: block;
  border-bottom: 5px solid transparent;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  transition: ease .25s;
}

.navbar-nav>li:hover:after {
  border-bottom: 5px solid #E74C3C;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

工作Codepen示例：

http://codepen.io/charliebeckstrand/pen/YWaWzp

要回答你的问题，JavaScript不一定是，我不相信它有一个官方用语。＆＃34; Animate Border Bottom＆＃34;是一个恰当的描述。

导航栏是否有一个术语，下面有条纹？

1 个答案: