Bootstrap Hoja de referencia

Hoja de referencia RTL

Contenidos

Tipografía

Documentación

Display 1

Display 2

Display 3

Display 4

Display 5

Display 6

Encabezado 1

Encabezado 2

Encabezado 3

Encabezado 4

Encabezado 5

Encabezado 6

Este es un párrafo destacado. Resalta respecto a los párrafos regulares.

Puedes usar la etiqueta mark para resaltar texto.

Esta línea de texto está destinada a ser tratada como texto eliminado.

Esta línea de texto está destinada a ser tratada como ya no precisa.

Esta línea de texto está destinada a ser tratada como una adición al documento.

Esta línea de texto se renderizará como subrayada.

Esta línea de texto está destinada a ser tratada como letra pequeña.

This line rendered as bold text.

Esta línea se renderiza como texto en cursiva.


Una cita conocida, contenida en un elemento blockquote.

Alguien famoso en Título de la fuente
  • Esta es una lista.
  • Aparece completamente sin estilo.
  • Estructuralmente, sigue siendo una lista.
  • Sin embargo, este estilo solo se aplica a los elementos hijos directos.
  • Nested lists:
    • no se ven afectados por este estilo
    • seguirán mostrando una viñeta
    • y tendrán el margen izquierdo apropiado
  • Esto puede seguir siendo útil en algunas situaciones.
  • Este es un elemento de lista.
  • Y otro más.
  • Pero se muestran en línea.

Imágenes

Documentación
Placeholder Responsive image
A generic square placeholder image with a white border around it, making it resemble a photograph taken with an old instant camera 200x200
# Primero Último Handle
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
# Primero Último Handle
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
Clase Encabezado Encabezado
Predeterminado Celda Celda
Primary Celda Celda
Secondary Celda Celda
Success Celda Celda
Danger Celda Celda
Warning Celda Celda
Info Celda Celda
Light Celda Celda
Dark Celda Celda
# Primero Último Handle
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter

Figuras

Documentación
Placeholder 400x300
Un pie de foto para la imagen de arriba.

Formularios

Visión general

Documentación
Nunca compartiremos tu correo electrónico con nadie más.
Botones de radio

Formularios deshabilitados

Documentación
Botones de radio deshabilitados

Tamaños

Documentación

Input group

Documentación
@
@example.com
https://example.com/users/
$ .00
Con textarea

Validación

Documentación
¡Se ve bien!
¡Se ve bien!
@
Por favor, elige un nombre de usuario.
Por favor, proporciona una ciudad válida.
Por favor, selecciona un estado válido.
Por favor, proporciona un código postal válido.
Debes aceptar antes de enviar.

Componentes

Accordion

Documentación

Este es el cuerpo del acordeón del primer elemento. Está oculto por defecto, hasta que el plugin collapse añade las clases apropiadas que usamos para estilizar cada elemento. Estas clases controlan la apariencia general, así como la visualización y ocultación mediante transiciones CSS. Puedes modificar cualquiera de esto con CSS personalizado o sobrescribiendo nuestras variables por defecto. También vale la pena señalar que casi cualquier HTML puede ir dentro del .accordion-body, aunque la transición sí limita el overflow.

Este es el cuerpo del accordion del segundo elemento. Está oculto por defecto, hasta que el plugin collapse añade las clases apropiadas que usamos para estilizar cada elemento. Estas clases controlan la apariencia general, así como mostrar y ocultar mediante transiciones CSS. Puedes modificar cualquiera de esto con CSS personalizado o sobrescribiendo nuestras variables por defecto. También vale la pena destacar que casi cualquier HTML puede ir dentro del .accordion-body, aunque la transición sí limita el overflow.

Este es el cuerpo del accordion del tercer elemento. Está oculto por defecto, hasta que el plugin collapse añade las clases apropiadas que usamos para estilizar cada elemento. Estas clases controlan la apariencia general, así como mostrar y ocultar mediante transiciones CSS. Puedes modificar cualquiera de esto con CSS personalizado o sobrescribiendo nuestras variables por defecto. También vale la pena destacar que casi cualquier HTML puede ir dentro del .accordion-body, aunque la transición sí limita el overflow.

Encabezado de ejemplo Nuevo

Encabezado de ejemplo Nuevo

Encabezado de ejemplo Nuevo

Encabezado de ejemplo Nuevo

Encabezado de ejemplo Nuevo

Encabezado de ejemplo Nuevo

Encabezado de ejemplo Nuevo

Encabezado de ejemplo Nuevo

Primary Secondary Success Danger Warning Info Light Dark

Buttons

Documentación
Placeholder Image cap
Título de card

Algún texto de ejemplo rápido para construir sobre el título de la card y formar la mayor parte del contenido de la card.

Ir a algún lugar
Destacado
Título de card

Algún texto de ejemplo rápido para construir sobre el título de la card y formar la mayor parte del contenido de la card.

Ir a algún lugar
Título de card

Algún texto de ejemplo rápido para construir sobre el título de la card y formar la mayor parte del contenido de la card.

  • Un elemento
  • Un segundo elemento
  • Un tercer elemento
Placeholder Image
Título de card

Esta es una card más ancha con texto de apoyo abajo como introducción natural a contenido adicional. Este contenido es un poco más largo.

Última actualización hace 3 minutos

List group

Documentación
  • Un elemento deshabilitado
  • Un segundo elemento
  • Un tercer elemento
  • Un cuarto elemento
  • Y un quinto
  • Un elemento
  • Un segundo elemento
  • Un tercer elemento
  • Un cuarto elemento
  • Y un quinto

Popovers

Documentación

Scrollspy

Documentación

Primer encabezado

Este es algún contenido de marcador de posición para la página de scrollspy. Ten en cuenta que a medida que te desplazas hacia abajo en la página, el enlace de navegación correspondiente se resalta. Se repite a lo largo del ejemplo del componente. Seguimos agregando más texto de ejemplo aquí para enfatizar el desplazamiento y el resaltado.

Segundo encabezado

Este es algún contenido de marcador de posición para la página de scrollspy. Ten en cuenta que a medida que te desplazas hacia abajo en la página, el enlace de navegación correspondiente se resalta. Se repite a lo largo del ejemplo del componente. Seguimos agregando más texto de ejemplo aquí para enfatizar el desplazamiento y el resaltado.

Tercer encabezado

Este es algún contenido de marcador de posición para la página de scrollspy. Ten en cuenta que a medida que te desplazas hacia abajo en la página, el enlace de navegación correspondiente se resalta. Se repite a lo largo del ejemplo del componente. Seguimos agregando más texto de ejemplo aquí para enfatizar el desplazamiento y el resaltado.

Cuarto encabezado

Este es algún contenido de marcador de posición para la página de scrollspy. Ten en cuenta que a medida que te desplazas hacia abajo en la página, el enlace de navegación correspondiente se resalta. Se repite a lo largo del ejemplo del componente. Seguimos agregando más texto de ejemplo aquí para enfatizar el desplazamiento y el resaltado.

Quinto encabezado

Este es algún contenido de marcador de posición para la página de scrollspy. Ten en cuenta que a medida que te desplazas hacia abajo en la página, el enlace de navegación correspondiente se resalta. Se repite a lo largo del ejemplo del componente. Seguimos agregando más texto de ejemplo aquí para enfatizar el desplazamiento y el resaltado.

Spinners

Documentación
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...
Cargando...

Tooltips

Documentación
Traducción mantenida por Esdocu. Visita esdocu.com para ver más documentaciones traducidas.