Question

在我正在开发的网站上，我已经用公司徽标替换了一个菜单项。但是，当使用断点（菜单切换到下拉菜单）时，我希望徽标变为普通菜单项，就像其他菜单一样，甚至可以删除它。

Answer 1

该链接无法在我的笔记本电脑上运行，但它与我的Android智能手机一起运行正常。我使用Android调试工具来检查您的网站。

您可以使用css和媒体查询隐藏菜单中的徽标，并在导航上方添加另一个徽标，并仅在桌面上显示。

低于css可能有所帮助。

    @media (min-width: 800px){
        .hide_desktop { display: none;  }
    }
    @media (min-width: 801px) {
        .hide_mobile { display: none;   }
    }

HTML标记

    <div class="hide_desktop"><a href="#home"><img src="logo.png"></a></div>
    <ul class="showing">
        <li><a href="#about_anchor"><li>ABOUT</li></a></li>
        <li><a href="#work_anchor">REVIEWS</a></li>
        <li class="hide_mobile"><a href="#home"><img src="logo.png"></a></li>
        <li><a href="#services_anchor">SERVICES</a></li>
        <li><a href="#connect_anchor">CONTACT</a></li>
        &nbsp;
    </ul>

断点上的菜单项更改

1 个答案: