点击设置->个性化->标题导航，选择“ Codeblocks配置”，支持HTML和CSS的代码嵌入，兼容PC和Mobile 。

* “表单配置”与“Codeblocks配置”不能同时使用。

*使用代码块自定义后，左侧的文字颜色和文本选择颜色设置将无效。

*该功能仅在付费版本中可用。

个人电脑

移动的

模板参考：

*您可以自定义和替换代码中的“一级”、“二级菜单”、“多级”、“其他多级”

一级导航栏

HTML：

 <ul class="custom-nav">
      <li>
        <a href="https://www.helplook.net/" target="_blank">一级</a>
      </li>
      <li>
        <a href="https://www.helplook.net/" target="_blank">一级</a>
      </li>
      <li>
        <a href="https://www.helplook.net/" target="_blank">一级</a>
      </li>
      <li>
        <a href="https://www.helplook.net/" target="_blank">一级</a>
      </li>
    </ul>

CSS：

 .hl-custom-nav {
        height: 100%;
        color: #000000;
      }
      .custom-nav {
        display: flex;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 100;
        margin: 0 auto;
      }
      .custom-nav ul,
      .custom-nav li {
        padding: 0;
        margin: 0;
      }
     .hl-custom-nav  li {
        list-style-type: none;
        width: 90px;
      }
      .custom-nav li a {
        display: block;
        text-align: center;
        text-decoration: none;
      }
      .custom-nav > li a {
        height: 65px;
        line-height: 65px;
      }
      .custom-nav ul li a {
        font-size: 14px;
        font-weight: normal;
      }
      .custom-nav li:hover > a {
        color: #0761e7;
      }

效果图：

article picture

二级导航栏

html：

 !# 3@!

CSS：

 .hl-custom-nav {
        height: 100%;
        color: #000000;
      }
      .custom-nav {
        display: flex;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 100;
        margin: 0 auto;
      }
      .custom-nav ul,
      .custom-nav li {
        padding: 0;
        margin: 0;
      }
     .hl-custom-nav li {
        list-style-type: none;
        width: 110px;
      }
      .custom-nav li a {
        display: block;
        text-align: center;
        text-decoration: none;
      }
      .custom-nav > li a {
        height: 65px;
        line-height: 65px;
      }
      .custom-nav > li ul a {
        height: 50px;
        line-height: 50px;
      }
      .custom-nav > li ul {
        background-color: #fff;
      }
      .custom-nav li ul {
        visibility: hidden;
        position: absolute;
        top: 60px;
      }
      .custom-nav ul li a {
        font-size: 14px;
        font-weight: normal;
      }
      .custom-nav li:hover > a {
        color: #0761e7;
      }
      .custom-nav > li:hover ul {
        visibility: visible;
        box-shadow: 0 0 0 0px #dcdfe6 inset;
      }
      .hl-custom-nav .diff-child {
        display: flex;
        flex-wrap: wrap;
        width: 250px;
      }
      .hl-custom-nav .diff-child li {
        margin-right: 12px;
      }

效果图：

一级和二级导航栏

html：

 !# 5@!

CSS：

 .hl-custom-nav {
        height: 100%;
        color: #000000;
      }
      .custom-nav {
        display: flex;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 100;
        margin: 0 auto;
      }
      .custom-nav ul,
      .custom-nav li {
        padding: 0;
        margin: 0;
      }
      .hl-custom-nav li {
        list-style-type: none;
        width: 110px;
      }
      .custom-nav li a {
        display: block;
        text-align: center;
        text-decoration: none;
      }
      .custom-nav > li a {
        height: 65px;
        line-height: 65px;
      }
      .custom-nav > li ul a {
        height: 50px;
        line-height: 50px;
      }
      .custom-nav > li ul {
        background-color: #fff;
      }
      .custom-nav li ul {
        visibility: hidden;
        position: absolute;
        top: 60px;
      }
      .custom-nav ul li a {
        font-size: 14px;
        font-weight: normal;
      }
      .custom-nav li:hover > a {
        color: #0761e7;
      }
      .custom-nav > li:hover ul {
        visibility: visible;
        box-shadow: 0 0 0 0px #dcdfe6 inset;
      }
      .hl-custom-nav .diff-child {
        display: flex;
        flex-wrap: wrap;
        width: 250px;
      }
      .hl-custom-nav .diff-child li {
        margin-right: 12px;
      }

效果图：