Bootstrap es un framework gratuito de código abierto que te ayuda a diseñar y desarrollar paguinas HTML responsivas de forma más rápida y sencilla. Es, en esencia, una colección de herramientas HTML, CSS y JavaScript preescritas que te proporcionan todo lo necesario para crear interfaces de usuario modernas y funcionales.
Es muy facil de usar. Simplifica enormemente el proceso de diseño web. En lugar de escribir todo el CSS desde cero, simplemente aplicas clases CSS predefinidas a tus elementos HTML. Por ejemplo, si quieres un botón azul, en lugar de definir un estilo, usas class='btn btn-primary'.
Para usar la librería Bootstrap con HTML, necesitas incluir los archivos CSS y JavaScript de Bootstrap en tu documento HTML.
<Html> <Head> <Link rel='StyleSheet' href='bootstrap.min.css'> <Script src='bootstrap.min.js'></Script> </Head> <Body> ... </Body> </Html>
Bootstrap cuenta con un potente sistema de cuadrícula responsivo basado en flexbox que facilita la creación de diseños de página complejos y bien estructurados. Puedes dividir tu página en filas y columnas y Bootstrap se encarga de que se reorganicen inteligentemente en diferentes tamaños de pantalla.
Es un conjunto de contenedores, filas y colunas que definen como se va a presentar y alineas el contenido
Cada fila en Bootstrap tienen 12 columnas.
| Clase | Descricion | Ancho de pantalla |
|---|---|---|
| .row | Especifica una fila | |
| .col- | Extra small | Menos de 576px |
| .col-sm- | Small | 576 a 768px |
| .col-md- | Medium | 768 a 992px |
| .col-lg- | Large | 992 a 1200px |
| .col-xl- | Extra large | 1200 a 1400px |
| .col-xxl- | Extra extra large | mas de 1400px |