【导航栏高亮 _导航栏】 | IT修真院·坑乎

导航栏高亮

我也踩过这个坑( 1 )

已统计您的踩坑,无需重复点击

回答(0)

导航栏

详细描述

截图

代码

HTML
<div class="nav-top">
        <div class="nav-top-content">
            <div class="top-content1"><a href="#">首页</a></div>
            <div class="top-content"><a href="task14-3.html">职业</a></div>
            <div class="top-content"><a href="task14-2.html">推荐</a></div>
            <div class="top-content"><a href="task14-2.html">关于</a></div>
        </div>
    </div>
CSS
.nav-top {
  @include container;
  @include flex;
  justify-content: flex-end;
}
@media only screen and (max-width: 767px) {
  .nav-top {
    display: none;
  }
}
.nav-top-content {
  display: flex;
}
.top-content a,
.top-content1 a{
  font-size: .18rem;
  color: $white;
  @include flex;
  justify-content: center;
  padding: .2rem .3rem;
}
.top-content a:hover,
.top-content1 a:hover{
  @include border-bottom (2px, solid, $white);
}
.top-content1 a {
  @include border-bottom (2px, solid, $white);
}

编辑于2024-04-20