如何在出现固定导航时隐藏图像

时间:2017-01-19 23:28:58

标签: html css

我在这里的网站上工作:http://americanbitcoinacademy.com/

当你在网站上滚动一下时会出现一个固定的导航,但是在这个固定的导航上我想要隐藏徽标导航但我还是希望它出现在顶部的常规导航栏上。

enter image description here

这是我正在使用的CSS:

.nav>li>a>img {
    max-width: none;
}
.menu-item a img {
    border: none;
    box-shadow: none;
    vertical-align: middle;
    width: auto;
    display: inline;
}

我希望它隐藏在黑色固定导航上,但我仍然希望它出现在常规导航中。不知道怎么做?

您可以使用Chrome的检查器进行检查。

2 个答案:

答案 0 :(得分:2)

导航菜单在固定/黑色时具有类.affix,因此使用它作为隐藏图像的父选择器应该将其隐藏在固定状态而不影响菜单的默认状态。

.main-menu.affix .menu-image {
  display: none;
}

答案 1 :(得分:0)

我不能在iPad上使用Chrome,因为海军蓝条在顶部看起来不同,当它在页面的下方时,我猜测在某些时候你会应用一个nav div的不同类别?

您可以使用样式display:none;

定位该类中的img

希望这有帮助,如果不是我确定计算机上的某个人可以提供更多的例子