Recientemente comencé a usar Twitter Bootstrap y parece que no puedo entender qué son los tramos y por qué hay diferentes tramos numerados, como span4, span12? ¿Y qué son las compensaciones y cuándo se usan? (A veces se usa con tramos) Intenté buscar en línea, pero solo encontré preguntas específicas sobre bootstraps.Bootstrap Spans
Las clases "span" de Bootstrap se usan en el bootstrap grid system.
La documentación muestra columnas etiquetadas con números, cada número representa la clase span utilizada para este contenedor. Los desplazamientos se muestran a la derecha en la siguiente sección, ellos definen cuántas columnas vacías deben estar a la izquierda del tramo.
Puede leer span4 offset2 como "extienda este bloque sobre 4 columnas, deje dos columnas vacías a la izquierda".
Por defecto hay 12 columnas. Si tiene un span12, será tan ancho como el container (que puede ser fluido).
En primer lugar, no son <span> etiquetas. (¡Menciono esto porque he comenzado a escribir <span> varias veces!) Son anchos de columna dentro de una fila.
De http://twitter.github.com/bootstrap/scaffolding.html#gridSystem:
<div class="row">
<div class="span4">...</div>
<div class="span8">...</div>
</div>
Los documentos también discuten las compensaciones.
22As lo que sé, si quieres estilo de un diseño de página de respuesta, también puede utilizar col-lg-2 o algunas clases como que, al escribir un margen de beneficio div, como
<div class="col-lg-2 col-sm-3 col-xs-6"> some content </div>
cuales definiría cuántas columnas ocupa un contenido en pantalla, para pantallas grandes, pequeñas y extrapequeñas. El punto es que tienes 12 columnas como máximo por fila, por lo que todo tu contenido en una fila debe respetar eso. No puede tener
<row>
<div class="col-lg-5">content1 </div>
<div class="col-lg-6">content2 </div>
<div class="col-lg-3">content3 </div>
</row>
porque aquí hay 14 columnas grandes. Solo las clases xs se suman a 24, aunque
Entonces, ¿span hace el mismo truco?
Eso es para bootstrap 3. span1 a span12 ---- eso es bootstrap 2. –
Además, al crear el cuerpo, ¿acabo de ponerlo en el contenedor de la clase? Debido a que hay tantas formas diferentes, me preguntaba, después de crear una barra de navegación, cuál es la forma correcta de crear el cuerpo y agregar cosas en él. ¿Y hay una manera de centrar un texto en digamos
etiquetas? – GrigorPara usar el sistema de cuadrícula, debe elegir un [diseño] (http://twitter.github.com/bootstrap/scaffolding.html#layouts), agregar al menos una fila (consulte el ejemplo de DavePs) y crear un lapso para cualquier elemento quieres posicionarte en la grilla Sin embargo, no necesita usar el sistema de cuadrícula, también estaría bien usar el ajuste de ancho manualmente, especialmente si no necesita muchas columnas. Creo que los estilos adicionales como el texto central se deben hacer en otro archivo CSS después de que se carga el bootstrap. Al igual que poner 'h1' en' div' con 'span12', darle una identificación o clase adicional y estilo CSS habitual con' text-align: center; ' – Kapep
kapep tiene razón sobre estilos adicionales - Creo que la descarga incluye un archivo application.css, pero si no lo hace, ponga sus estilos en él para que una actualización a Bootstrap mantenga sus cambios intactos. – DaveP