Bootstrap Starter Code: Building a Responsive Website

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Bootstrap Starter Template</title>

  <!-- Bootstrap CSS -->

  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/css/bootstrap.min.css">

</head>

<body>

  <!-- Navigation Bar -->

  <nav class="navbar navbar-expand-lg navbar-light bg-light">

    <div class="container-fluid">

      <a class="navbar-brand" href="#">Your Website</a>

      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">

        <span class="navbar-toggler-icon"></span>

      </button>

      <div class="collapse navbar-collapse" id="navbarNav">

        <ul class="navbar-nav">

          <li class="nav-item">

            <a class="nav-link" href="#">Home</a>

          </li>

          <li class="nav-item">

            <a class="nav-link" href="#">About</a>

          </li>

          <li class="nav-item">

            <a class="nav-link" href="#">Contact</a>

          </li>

        </ul>

      </div>

    </div>

  </nav>

  <!-- Header Section -->

  <header class="bg-dark text-white text-center py-5">

    <h1>Welcome to Your Website</h1>

    <p>This is a simple Bootstrap starter template.</p>

  </header>

  <!-- Content Section -->

  <section class="container mt-5">

    <h2>Content Section</h2>

    <p>This is the main content area of your website.</p>

  </section>

  <!-- Bootstrap JS (Optional, only required if you want to use Bootstrap's JavaScript features) -->

  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.min.js"></script>

</body>

</html>

Copy and paste this code into an HTML file, save it, and open it in a web browser. You will see a navigation bar, a header section with a dark background, and a content section below it. You can customize and expand upon this template by adding more Bootstrap components and styling as needed.

Remember to include the Bootstrap CSS and JS files from a CDN or your local installation to ensure the framework's styles and functionality work correctly.

Enjoy exploring Bootstrap and building your website!

Your Website

• Home
• About
• Contact

Welcome to Your Website

This is a simple Bootstrap starter template.

Content Section

This is the main content area of your website.