Elementos básicos.
Encabezado
También puedes utilizar la etiqueta
<small> para agregar texto secundario como se muestra en el siguiente ejemplo:Alineación
Utiliza las clases
text-left, text-center, text-right y text-justify en párrafos para alinearlos a la izquierda, centro, derecha y justificados respectivamente.Tablas
Para aplicarle los estilos de Bootstrap a las tablas debes agregar la clase
table:<table class="table">
...
</table>
Tablas con bandas
Agrega la clase
table-striped para intercalar el fondo de las filas entre blanco y gris:<table class="table table-striped">
...
</table>
Botones
Agrega la clase
btn sobre las etiquetas <a> y <button>, en conjunto con una de las siguientes clases para crear un botón más estilizado: btn-default, btn-primary, btn-success, btn-info, btn-warning, btn-danger o btn-link.<button type="button" class="btn btn-default
Tamaños
Utiliza las clases
btn-lg, btn-sm y btn-xs para cambiar el tamaño del botón.Mostrar en bloque
Utiliza la clase
btn-block para que el botón ocupe el 100% del elemento que lo contiene.Botones deshabilitados
Agrega la propiedad
disabled sobre los <button> y la clase .disabled sobre los <a> para que el botón parezca deshabilitado:<a href="#" class="btn btn-primary disabled">
Imágenes
Para hacer las imágenes responsive agrega la clase
img-responsive a <img>:<img src="..." class="img-responsive" alt="Responsive image">
Utiliza la clase
img-rounded para aplicarle borders redondeados a la imagen:<img src="..." alt="..." class="img-rounded">
Utiliza la clase
img-circle para que la imagen aparezca en un círculo:<img src="..." alt="..." class="img-circle">
Utiliza la clase
img-thumbnail para agregarle un bordes redondeados y un borde adicional a la imagen: