Bootstrap

Es una librería JavaScript para el desarrollo de front-ends.

Inicio

Estructura de archivos

  bootstrap/
  ├── css/
  │   ├── bootstrap.css
  │   ├── bootstrap.min.css
  ├── js/
  │   ├── bootstrap.js
  │   ├── bootstrap.min.js
  └── img/
      ├── glyphicons-halflings.png
      └── glyphicons-halflings-white.png

Plantilla

<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap 101 Template</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
  </head>
  <body>
    <h1>Hello, world!</h1>
    <script src="http://code.jquery.com/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
  </body>

Maquetación web

La web se dividirá en 12 posibles columnas.

Menús

<nav class="navbar">
  <div class="navbar-inner">
    <a class="brand" href="#">Hindoor System Management</a>
    <ul class="nav">
      <li class="active"><a href="#">Nodes</a></li>
      <li><a href="#">Configs</a></li>
      <li><a href="#">Stats</a></li>
    </ul>
  </div>
</nav>

Podemos usar el estilo navbar navbar-inverse.

Programming

Herramientas de usuario

Herramientas del sitio

Tabla de Contenidos

Bootstrap

Inicio

Estructura de archivos

Plantilla

Maquetación web

Menús

Navbar

Notas

Recursos

Herramientas de la página