greatbody
/
freeCodeCamp
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
freeCodeCamp/guide/spanish/css/css-frameworks/css-framework-bootstrap/index.md

4.1 KiB
Raw Blame History

title localeTitle
CSS Framework Bootstrap CSS Framework Bootstrap

CSS Framework Bootstrap

Bootstrap es el marco CSS más popular para el desarrollo de primeros proyectos móviles adaptables para la web.

Primeros pasos - Última versión: 4.1

Aquí hay una plantilla HTML simple que incluye lo último en CSS y Javascript compilados y minificados para la biblioteca Bootstrap. Hemos utilizado un CDN en este ejemplo, pero puede verificar otras formas de instalar Bootstrap .


    <!DOCTYPE html> 
    <html lang="en"> 
      <head> 
        <meta charset="utf-8"> 
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
        <title>Bootstrap</title> 
 
        <!--Latest compiled and minified CSS--> 
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"> 
      </head> 
      <body> 
        <!-- Add all HTML Code below --> 
 
        <!-- Add all HTML Code above --> 
 
        <!-- jQuery --> 
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> 
        <!-- popper.js --> 
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> 
        <!-- Latest compiled bootstrap JavaScript --> 
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script> 
      </body> 
    </html>

Empezando - Bootstrap 3

Bootstrap 3 no es la última versión estable de Bootstrap, pero sigue siendo la versión más utilizada. Lo encontrarás en muchas plantillas, temas de wordpress, proyectos y muchos más. Con eso en mente, está claro que todavía es útil saber cómo usarlo. No dudes en ir a través de la excelente documentación de Bootstrap .


<!DOCTYPE html> 
 <html lang="en"> 
  <head> 
    <!-- Required meta tags --> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <!-- Bootstrap 3 CSS --> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> 
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]--> 
  </head> 
  <body> 
    <!-- Add all HTML Code below --> 
 
    <!-- Add all HTML Code above --> 
 
    <!-- jQuery library --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <!-- IU jQuery for better animations--> 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
    <!-- compiled JavaScript --> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
  </body> 
 </html>

Nota: Otras versiones están disponibles y se pueden encontrar en el sitio web de Bootstrap.

Recursos de aprendizaje

  • Revisa la documentación oficial de Bootstrap 4 aquí
  • Revisa la documentación oficial de Bootstrap 3 aquí .
  • Revisa el repositorio de GitHub de código abierto de Bootstrap aquí .
  • En FreeCodeCamp , enseñamos Bootstrap como parte de nuestro plan de estudios.