更改当前页面导航CSS

时间:2015-08-23 20:03:57

标签: css

如何更改我当前所在菜单项的文字颜色? 基本上我需要导航文本颜色为用户当前所在页面的白色。

背景颜色正常,但颜色不是。 .top-menu li.current-menu-item.current-menu-item 肯定会影响当前的背景颜色,但文字颜色不会改变。

  .ui.nav {
     background-color: transparent;
     border: medium none;
     height: 100px;
     margin-bottom: 3px;
     margin-right: 3%;
     float: right;
  }
  .ui.nav li:hover {
     color: red;
  }
  .ui.nav li {
     height: 100px;
     vertical-align:middle;
     transition: all .3s ease;
   }
  .ui.nav li:hover {
     background-color: #119BD7;
     transition: all .3s ease;
    }
  .ui.nav > li + li{
     border: none;
    }
  .ui.nav li a {
     color: #000;
     font-weight: bold;
     letter-spacing:1px;
     padding:0 10px;
     line-height: 100px;
     transition: all .3s ease;
   }
.ui.nav li:nth-child(1) {
     margin-left:24px;
   }
 .ui.nav li a:hover {
     color:#FFF;
     transition: all .3s ease;
    }
.top-menu li.current-menu-item. a.selected:link, a.selected:visited{
   color: #FFF !important;
     }
.top-menu li.current-menu-item.current-menu-item {
    background-color: #119BD7;
    color: #FFF !important;
    opacity: 1;
    }
.top-menu li.current-menu-item.current-menu-item:hover{
   background-color: #119BD7;
  color: #FFF !important;
 }

1 个答案:

答案 0 :(得分:0)

这解决了它。

  .top-menu li.current-menu-item.current-menu-item a {
     background-color: #119BD7;
     color: #FFF !important;
     opacity: 1;
   }