header.html

<header>
  <div class="wrapper">
    <div class="left">  <!-- 左侧 -->
      <div class="logo">
        <!-- 搜索引擎优化 -->
        <h1>
          <a href="./index.html">Class Widgets</a> <!-- 搜索关键字 -->
        </h1>
      </div>
      <div class="tabs">
        <a href="index.html" class="tab">首页</a>
        <a href="docs-user.html" class="tab">使用文档</a>
        <a href="docs-dev.html" class="tab">开发文档</a>
        <a href="contact.html" class="tab">社区</a>
      </div>
    </div>

    <div class="right">  <!-- 右侧 -->
      <a href="https://www.bilibili.com/video/BV1xwW9eyEGu/" target="_blank" class="toolButton" title="在哔哩哔哩上观看宣传视频">
        <img src="./assets/svg/bilibili.svg" alt="Bilibili">
      </a>
      <a href="https://github.com/Class-Widgets/Class-Widgets" target="_blank" class="toolButton" title="前往我们的GitHub仓库">
        <img src="./assets/svg/github.svg" alt="GitHub">
      </a>
      <!-- 下载CW -->
      <a href="https://classwidgets.lao-shui.top/download" target="_blank" class="pushButton primary">
        <i class="icon-ic_fluent_arrow_download_20_filled"></i>
        现在体验
      </a>
    </div>
  </div>
</header>