Herramientas de usuario
sp:fw:bootstrap
Diferencias
Muestra las diferencias entre dos versiones de la página.
| Ambos lados, revisión anterior Revisión previa Próxima revisión | Revisión previa | ||
|
sp:fw:bootstrap [2013/07/13 08:43] alfred [Navbar] |
sp:fw:bootstrap [2020/05/09 09:25] (actual) |
||
|---|---|---|---|
| Línea 9: | Línea 9: | ||
| ├── css/ | ├── css/ | ||
| │ ├── bootstrap.css | │ ├── bootstrap.css | ||
| - | │ ├── bootstrap.min.css | + | │ └── bootstrap.min.css |
| ├── js/ | ├── js/ | ||
| │ ├── bootstrap.js | │ ├── bootstrap.js | ||
| - | │ ├── bootstrap.min.js | + | │ └── bootstrap.min.js |
| └── img/ | └── img/ | ||
| ├── glyphicons-halflings.png | ├── glyphicons-halflings.png | ||
| Línea 35: | Línea 35: | ||
| ===== Maquetación web ===== | ===== Maquetación web ===== | ||
| La web se dividirá en 12 posibles columnas. | La web se dividirá en 12 posibles columnas. | ||
| + | |||
| + | ==== Contenedores ==== | ||
| + | === Contenedor principal === | ||
| + | Centrado en la página: | ||
| + | <code html> | ||
| + | <div class="container"> | ||
| + | ... | ||
| + | </div> | ||
| + | </code> | ||
| + | === Estructurado === | ||
| + | <code html> | ||
| + | <div class="container-fluid"> | ||
| + | <div class="row-fluid"> | ||
| + | <div class="span2"> | ||
| + | <!--Sidebar content--> | ||
| + | </div> | ||
| + | <div class="span10"> | ||
| + | <!--Body content--> | ||
| + | </div> | ||
| + | </div> | ||
| + | </div> | ||
| + | </code> | ||
| ===== Menús ===== | ===== Menús ===== | ||
| ==== Navbar ==== | ==== Navbar ==== | ||
| Línea 49: | Línea 71: | ||
| </nav> | </nav> | ||
| </code> | </code> | ||
| + | Podemos usar el estilo ''navbar navbar-inverse''. \\ | ||
| + | {{:fw:bootstrap:navbar.png?direct&100|}}{{:fw:bootstrap:navbar-inverse.png?direct&100|}} \\ | ||
| + | |||
| + | ==== Sidebar ==== | ||
| + | <code html> | ||
| + | <ul class="nav nav-list affix"> | ||
| + | <li><a href="#">Observers</a></li> | ||
| + | <li><a href="#">Delegates</a></li> | ||
| + | <li><a href="#">Starters</a></li> | ||
| + | <ul class="nav nav-list affix"> | ||
| + | <li><a href="#">192.168.1.125</a></li> | ||
| + | <li><a href="#">192.168.1.126</a></li> | ||
| + | <li class="active"><a href="#">192.168.1.127</a></li> | ||
| + | <li><a href="#">192.168.1.140</a></li> | ||
| + | <li><a href="#">192.168.1.225</a></li> | ||
| + | <li><a href="#">192.168.1.235</a></li> | ||
| + | <li><a href="#">192.168.1.236</a></li> | ||
| + | </ul> | ||
| + | </ul> | ||
| + | </code> | ||
| + | {{:fw:bootstrap:sidebar.png?direct&100|}} | ||
| + | === Separador === | ||
| + | <code html> | ||
| + | <li class="divider"></li> | ||
| + | </code> | ||
| + | ===== Tablas ===== | ||
| + | <code html> | ||
| + | <table class="table table-hover"> | ||
| + | <col width="50"> | ||
| + | <thead> | ||
| + | <tr> | ||
| + | <th > </th> | ||
| + | <th>Host</th> | ||
| + | <th>Configuration</th> | ||
| + | </tr> | ||
| + | </thead> | ||
| + | <tbody> | ||
| + | <tr style="cursor:pointer;"> | ||
| + | <td><i class="icon-off"></i></td> | ||
| + | <td>192.168.145.200:454</td> | ||
| + | <td><span class="label label-info">CSS-01</span></td> | ||
| + | </tr> | ||
| + | <tr style="cursor:pointer;"> | ||
| + | <td><i class="icon-off"></i></td> | ||
| + | <td>192.168.145.44:1454</td> | ||
| + | <td><span class="label label-info">CSS-05</span></td> | ||
| + | </tr> | ||
| + | <tr style="cursor:pointer;"> | ||
| + | <td><i class="icon-off"></i></td> | ||
| + | <td>192.168.45.44:7884</td> | ||
| + | <td><span class="label label-info">RFactor</span></td> | ||
| + | </tr> | ||
| + | </tbody> | ||
| + | </table> | ||
| + | </code> | ||
| + | {{:fw:bootstrap:tabla.png?direct&100|}} | ||
| ===== Notas ===== | ===== Notas ===== | ||
| ==== Recursos ==== | ==== Recursos ==== | ||
sp/fw/bootstrap.1373705032.txt.gz · Última modificación: 2020/05/09 09:24 (editor externo)
Herramientas de la página
Excepto donde se indique lo contrario, el contenido de este wiki esta bajo la siguiente licencia: CC Attribution-Noncommercial-Share Alike 4.0 International
