如何使用html和twitter-bootstrap创建类似instagram的注册和登录页面

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

<ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active" id="register-tab" data-bs-toggle="tab" href="#register">注册</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="login-tab" data-bs-toggle="tab" href="#login">登录</a>
  </li>
</ul>

<div class="tab-content">
  <div class="tab-pane fade show active" id="register">
    <!-- 注册表单内容 -->
  </div>
  <div class="tab-pane fade" id="login">
    <!-- 登录表单内容 -->
  </div>
</div>

<form>
  <div class="mb-3">
    <label for="register-username" class="form-label">用户名</label>
    <input type="text" class="form-control" id="register-username" placeholder="请输入用户名">
  </div>
  <div class="mb-3">
    <label for="register-password" class="form-label">密码</label>
    <input type="password" class="form-control" id="register-password" placeholder="请输入密码">
  </div>
  <button type="submit" class="btn btn-primary">注册</button>
</form>

<form>
  <div class="mb-3">
    <label for="login-username" class="form-label">用户名</label>
    <input type="text" class="form-control" id="login-username" placeholder="请输入用户名">
  </div>
  <div class="mb-3">
    <label for="login-password" class="form-label">密码</label>
    <input type="password" class="form-control" id="login-password" placeholder="请输入密码">
  </div>
  <button type="submit" class="btn btn-primary">登录</button>
</form>