myWebsite
/
index.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset='utf-8'>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="css/blog.css">
        <link rel="stylesheet" type="text/css" href="css/nav.css">
    </head>
    <script src="js/jquery-3.5.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/nav.js"></script>
    <body>
      <div class="container">
        <h3 class="text-muted">一只码农正在发呆......</h3>
        <!-- 这是选项卡 -->
        <ul class="nav nav-pills">
          <li class="active"><a href="#topic" id="blogLink">博客</a></li>
          <li><a href="#video">视频</a></li>
          <li><a href="http://127.0.0.1/game">游戏</a></li>
          <li><a href="#contactme">联系我</a></li>
        </ul>
        <!-- 这是面板 -->
        <div class="tab-content">
          <div class="tab-pane active" id="topic"></div>
          <div class="tab-pane" id="video"></div>
          <div class="tab-pane" id="game"></div>
          <div class="tab-pane" id="contactme"></div>
        </div>
      </div>
      <footer class="blog-footer">
        <p>Blog template built for <a href="http://getbootstrap.com">Bootstrap</a> by <a href="https://blog.csdn.net/maxdaic">@lilianwen</a>.</p>
        <p>
          <a href="#">Back to top</a>
        </p>
      </footer>
    </body>
</html>