1 - ¿Qué es Bootstrap?

Bootstrap es un framework de CSS que nos facilita y estandariza el desarrollo de sitios web.

Esta pensando para que se adapte tanto a las pantallas de equipos de escritorio como a móviles y tablets.

Bootstrap es desarrollado y mantenido por la empresa Twitter y la ha liberado como un producto Open Source.

Tiene una filosofía muy intuitiva para el maquetado de sitios web que puede ser rápidamente aprendida por desarrolladores que no vienen del mundo del diseño web.

La versión estable actual es la 4.x

El corazón de este framework es un archivo CSS que lo podemos descargar del sitio http://getbootstrap.com.

Luego debemos enlazar a nuestra página con el archivo boottrap.min.css y ya podemos utilizar esta librería.

La primera clase que podemos probar es class="container" (esta muestra todo el contenido del div centrado), además el framework ya define estilos por defecto para una gran cantidad de elementos HTML de la página, por ejemplo define la tipografía de tipo Helvética.

El código mínimo de nuestra página es:

<!DOCTYPE html> 
<html> 
<head> 
  <title>Prueba de Bootstrap</title> 
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <link href="css/bootstrap.min.css" rel="stylesheet"> 
</head> 
<body> 
  <div class="container" style="background-color:#ccc">
    <h1>Titulo</h1> 
    <p>Esto es una prueba de bootstrap 4.</p>
  </div> 
</body> 
</html> 

Para trabajar con Bootstrap en forma local en su máquina le recomiendo el editor de texto VS Code

Ejecutar Ejemplo

Retornar