本博客自定义导航栏所使用html代码如下:

<div class="menus_item">
    <a class="site-page" href="https://blog.3322.site/index.php/category/js/" title="技术">
        <i class="fa-fw fas fa-book"></i>
        <span>技术</span>
    </a>
</div>
<div class="menus_item">
    <a class="site-page group" href="javascript:void(0);" rel="external nofollow noreferrer">
        <i class="fas fa-person-breastfeeding"></i>
        <span>生活</span>
        <i class="fas fa-chevron-down"></i>
    </a>
    <ul class="menus_item_child">
        <li>
            <a class="site-page child" href="https://blog.3322.site/index.php/category/moods/">
                <i class="fas fa-heart-pulse"></i>
                <span>心情</span></a>
        </li>
        <li>
            <a class="site-page child" href="https://blog.3322.site/index.php/category/mess/">
                <i class="fas fa-mug-hot"></i>
                <span>杂项</span></a>
        </li>
    </ul>
</div>
<div class="menus_item">
    <a class="site-page group" href="javascript:void(0);" rel="external nofollow noreferrer">
        <i class="fas fa-user"></i>
        <span>关于</span>
        <i class="fas fa-chevron-down"></i>
    </a>
    <ul class="menus_item_child">
        <li>
            <a class="site-page child" href="https://blog.3322.site/index.php/about.html">
                <i class="fas fa-at"></i>
                <span>关于我</span></a>
        </li>
        <li>
            <a class="site-page child" href="https://blog.3322.site/index.php/message.html">
                <i class="fas fa-square-envelope"></i>
                <span>留言板</span></a>
        </li>
    </ul>
</div>
<div class="menus_item">
    <a class="site-page group" href="javascript:void(0);" rel="external nofollow noreferrer">
        <i class="fas fa-flask"></i>
        <span>实验室</span>
        <i class="fas fa-chevron-down"></i>
    </a>
    <ul class="menus_item_child">
        <li>
            <a class="site-page child" href="https://img.3322.site/" target="_BLANK">
                <i class="fas fa-image"></i>
                <span>图床</span></a>
        </li>
        <li>
            <a class="site-page child" href="https://ipan233-gobingai.hf.space/" target="_BLANK">
                <i class="fas fa-b"></i>
                <span>BingAI</span></a>
        </li>
        <li>
            <a class="site-page child" href="https://chat.3322.now.cc/" target="_BLANK">
                <i class="fa-brands fa-first-order"></i>
                <span>ChatGPT</span></a>
        </li>
        <li>
            <a class="site-page child" href="https://t.me/CodingCat_bot/" target="_BLANK">
                <i class="fas fa-ghost"></i>
                <span>Coze tgbot</span></a>
        </li>
        <li>
            <a class="site-page child" href="https://gemini.ippp.pp.ua/" target="_BLANK">
                <i class="fa-brands fa-google"></i>
                <span>Gemini</span></a>
        </li>
    </ul>
</div>
<div class="menus_item">
    <a class="site-page group" href="javascript:void(0);" rel="external nofollow noreferrer">
        <i class="fas fa-video"></i>
        <span>监控</span>
        <i class="fas fa-chevron-down"></i>
    </a>
    <ul class="menus_item_child">
        <li>
            <a class="site-page child" href="https://nz-data.pbot.eu.org/" target="_BLANK">
                <i class="fa-brands fa-get-pocket"></i>
                <span>哪吒</span></a>
        </li>
        <li>
            <a class="site-page child" href="https://ipan233-uptime.hf.space/status/monit/" target="_BLANK">
                <i class="fa-brands fa-upwork"></i>
                <span>uptime</span></a>
        </li>
    </ul>
</div>