Clase 13 - Trabajo Práctico Layout Responsivo Bootstrap

Trabajo Práctico

No hubo muchas entregas del trabajo práctico, por lo que dedicamos la clase a revisar y finalizar el trabajo.

Repasamos la consigna de entrega:

• Construir la estructura (layout) de un sitio web usando Bootstrap
• Usar la última versión del framework Bootstrap
• En caso de basarse en un sitio de ejemplo, incluir el sitio que se usó como referencia.
• En caso de no basarse en ningún sitio, aclarar eso al momento de la entrega
• Definir al menos 2 breakpoints distintos.
  • Un breakpoint mobile inicial
  • Un breakpoint adicional para pantallas más grandes, esto puede ser sm, md, etc…
• Incluir algun(os) componente(s) de Bootstrap
  • Botones
  • Navbar
  • Card
  • Filas y Columnas
  • Carousel
  • Formularios

Subir el sitio a github, dentro del repositorio de entregas.

En caso de usar imágenes, lo más conveniente es incluir también las imágenes en el repositorio. Tener en cuenta que las imágenes deberán incluirse usando rutas relativas respecto al HTML o absolutas respecto a la web publicada en github pages.

Botón Responsivo

Vimos un ejemplo para poder hacer “aparecer y desaparecer” un botón, pero se puede aplicar para distintos elementos o secciones de una página.

<button type="button" class="btn btn-primary d-none d-sm-block">
    Pantalla Grande
</button>

<button type="button" class="btn btn-secondary d-sm-none">
    BTN
</button>