2. Fue desarrollado por Mark Otto y Jacob
Thornton de Twitter, y fue originalmente
llamado Blueprint de Twitter. La idea nació
como un framework para fomentar la
consistencia entre las herramientas internas.
HISTORIA
Bootstrap fue liberado bajo licencia MIT
en el 2011 y continúa en un repositorio de
GitHub. Actualmente, es el segundo
proyecto más destacado en GitHub.
3. ¿Qué es Bootstrap?
El framework
Bootstrap vio la luz
en el año 2011.
Se trata de un framework que ofrece la posibilidad de crear un sitio web
totalmente responsive mediante el uso de librerías CSS. En estas
librerías, nos podemos encontrar un gran número elementos ya
desarrollados y listos para ser utilizados como pueden ser botones,
menús, cuadros e incluso un amplio listado de tipografías.
Características de Bootstrap
a) Fácil e intuitivo
b) Compatibles con todos los navegadores
d) Amplia comunidad de
desarrolladores tras el proyecto
c) Optimizado para dispositivos móviles
DEFINICIÓN
4. BOOTSTRAP 4
Bootstrap en su versión 4 es aún más potente con herramienta para crear
interfaces de usuario pulcras y adaptables a todo tipo de dispositivos y
pantallas, sea cual sea su tamaño.
Características principales:
➔ Cambio de LESS a SASS.
➔ Archivo reboot.css, para hacer nuestros “reset CSS”.
➔ No más soporte para IE8.
➔ Se mejoraron los Tooltips y Popovers gracias a la librería JS: Tether.
➔ Soporte para Flexbox.
➔ Se reemplazaron los: well, thumbnails y panels por los Card.
➔ Mejoras en el sistema de grid.
➔ Se agregó soporte para Jquery 2.
➔ Como unidades de medida se usarán ahora “rem” y “em”.
5. Bootstrap define la tipografía para distintos tipos de texto
● h1, h2, h3, h4, h5, h6; Semibold 36px, 30px, 24px, 18px, 14px, 12px
○ Con <small> dentro del header se puede añadir texto más pequeño
● <body> y <p>
○ font-size por defecto 14px, con line-height 1.428
○ <p> tienen un margen inferior por defecto de 10px
○ <p class=”lead”> para resaltar el texto
○ También <small> <strong> y <em>
○ Alineación de texto
■ <p class=”text-left”> Texto alineado a la izquierda</p>
■ <p class=”text-center”> Texto centrado </p>
■ <p class=”text-right”> Texto alineado a la derecha </p>
○ <abbr title=”abreviatura”> abr </abbr>
○ <address> para direcciones
○ <blockquote> para citar un texto
● Listas
● Código
○ En línea: <code><code><</code>
○ En bloque: <pre> ... código en varias líneas … </pre>
TIPOGRAFÍA
6. PLANTILLA BÁSICA
Bootstrap funciona con documentos HTML 5
El viewport es un atributo que permite definir la anchura de la ventana
del navegador para adaptar la página automáticamente
Inclusión de la librería CSS de bootstrap
Necesita Jquery
Inclusión de la librería JS de Bootstrap