maxresdefault 46

Float en Bootstrap 5 (Mi primer página Web)

La clase float en Bootstrap 5 hace flotar un elemento a la izquierda (start) o la derecha (end), o deshabilitan la flotación, según el tamaño actual de la ventana. La clase float usa los mismos puntos de ruptura de la ventana gráfica que nuestro sistema de cuadrícula.

Codigo de la clase float en Bootstrap 5: https://github.com/programadornovato/MiPaginaWeb/commit/37df3c8d726c3acd6b1faa9a3a73d4bf61b9c6ad

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <title>Mi primer pagina Web</title>
</head>

<body>
    <div class="container">
        <div class="float-sm-start float-md-none float-lg-end bg-primary border">Start</div>
        <div class="float-sm-end float-md-none  float-lg-start bg-danger border">End</div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>
</body>

</html>

🎦[Curso] Visual Studio Code 🆚 de 0 a 100: https://www.youtube.com/watch?v=s47z_qh16j4&list=PLCTD_CpMeEKQbdlT8efsS-veXuvYZ1UWn&ab_channel=programadornovato
🎦[Curso] Bootstrap de 0 a 100 🌈: https://www.youtube.com/watch?v=_paV6qQ-a4M&list=PLCTD_CpMeEKSVmsZJIumVvfDviuW-c9AT&ab_channel=programadornovato
🎦[Curso] Javascript🔥 de 0 a 100: https://www.youtube.com/watch?v=fwtaVaiR-Kg&list=PLCTD_CpMeEKQZtB8mNm0J1qWmHdZ2QUt-&ab_channel=programadornovato

Anterior tutorial Siguiente tutorial

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Información básica sobre protección de datos Ver más

  • Responsable: Eugenio Chaparro.
  • Finalidad:  Moderar los comentarios.
  • Legitimación:  Por consentimiento del interesado.
  • Destinatarios y encargados de tratamiento:  No se ceden o comunican datos a terceros para prestar este servicio. El Titular ha contratado los servicios de alojamiento web a digitalocean.com que actúa como encargado de tratamiento.
  • Derechos: Acceder, rectificar y suprimir los datos.
  • Información Adicional: Puede consultar la información detallada en la Política de Privacidad.

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Contiene enlaces a sitios web de terceros con políticas de privacidad ajenas que podrás aceptar o no cuando accedas a ellos. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad