Barra de navegación Bootstrap responsiva

10950 webleb

Video Publica tu código

Barra de navegación Bootstrap responsiva

Recomendado

21 October 2024

Entradas de un solo dígito con un elemento

19 May 2025

juego de respuestas

9 October 2025

Animación de carga CSS: círculo, línea, punto

index.html

<!doctype html>
<html lang="en">
<head>
  <title>Webleb</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
</head>
<body>
  <nav class="navbar navbar-expand-lg navbar-dark" style="background-color: rgb(8, 57, 102);">
    <div class="container px-4">
      <a class="navbar-brand" href="/">
        <span style="color:#ffffff; font-size:26px; font-weight:bold; letter-spacing: 1px;">Logo</span>
      </a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
        aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"><span
          class="navbar-toggler-icon"></span></button>
      <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
          <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
          <li class="nav-item"><a class="nav-link" href="/code">Blog</a></li>
          <li class="nav-item"><a class="nav-link" href="/pricing">Services</a></li>
          <li class="nav-item"><a class="nav-link" href="/about">About</a></li>
          <li class="nav-item"><a class="nav-link" href="/faq">Contact Us</a></li>
        </ul>
      </div>
    </div>
  </nav>
  
  <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"
    integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous">
    </script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.min.js"
    integrity="sha384-7VPbUDkoPSGFnVtYi0QogXtr74QeVeeIs99Qfg5YCF+TidwNdjvaKZX19NZ/e6oz" crossorigin="anonymous">
    </script>
</body>
</html>

Barra de navegación Bootstrap responsiva

Recomendado

Entradas de un solo dígito con un elemento

juego de respuestas

Animación de carga CSS: círculo, línea, punto

index.html

styles.css

main.js

Recomendado

Entradas de un solo dígito con un elemento

juego de respuestas

Animación de carga CSS: círculo, línea, punto

index.htmlCopy

styles.cssCopy

main.js Copy

index.html

styles.css

main.js