BootstrapCheatsheet

Folla de trucos RTL

Contidos

Tipografía

Documentación

Pantalla 1

Pantalla 2

Pantalla 3

Pantalla 4

Pantalla 5

Pantalla 6

Título 1

Título 2

Título 3

Título 4

Título 5

Título 6

Este é un parágrafo principal. Destaca dos parágrafos habituais.

Podes usar a etiqueta mark paradestacartexto.

Esta liña de texto está destinada a ser tratada como texto eliminado.

Esta liña de texto está destinada a ser tratada como xa non precisa.

Esta liña de texto está destinada a ser tratada como unha adición ao documento.

Esta liña de texto mostrarase como subliñada.

Esta liña de texto está destinada a ser tratada como letra pequena.

Esta liña mostrouse como texto en negra.

Esta liña mostrouse como texto en cursiva.

Unha cita coñecida, contida nun elemento blockquote.

Alguén famoso en Source Title
  • Esta é unha lista.
  • Parece totalmente sen estilo.
  • Estruturalmente, aínda é unha lista.
  • Non obstante, este estilo só se aplica aos elementos fillos inmediatos.
  • Listas anidadas:
    • non se ven afectados por este estilo
    • aínda mostrará unha bala
    • e ter unha marxe esquerda adecuada
  • Isto aínda pode ser útil nalgunhas situacións.
  • Este é un elemento da lista.
  • E outra.
  • Pero móstranse en liña.

Imaxes

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

Táboas

Documentación
# Primeira Último Manexar
1 Marcos Oto @mdo
2 Xacobe Thornton @graxas
3 Larry o paxaro @twitter
# Primeira Último Manexar
1 Marcos Oto @mdo
2 Xacobe Thornton @graxas
3 Larry o paxaro @twitter
Clase Título Título
Por defecto Célula Célula
Primaria Célula Célula
Secundaria Célula Célula
Éxito Célula Célula
Perigo Célula Célula
Aviso Célula Célula
Información Célula Célula
Luz Célula Célula
Escuro Célula Célula
# Primeira Último Manexar
1 Marcos Oto @mdo
2 Xacobe Thornton @graxas
3 Larry o paxaro @twitter

Figuras

Documentación
Placeholder 400x300
Unha lenda para a imaxe superior.

Formularios

Visión xeral

Documentación
Nunca compartiremos o teu correo electrónico con ninguén.
Botóns de radio

Formularios desactivados

Documentación
Botóns de radio desactivados

Talla

Documentación

Grupo de entrada

Documentación
@
@example.com
https://example.com/users/
$ .00
Con área de texto

Etiquetas flotantes

Documentación

Validación

Documentación
Parece ben!
Parece ben!
@
Escolla un nome de usuario.
Indica unha cidade válida.
Selecciona un estado válido.
Proporciona un código postal válido.
Debes aceptar antes de enviar.

Compoñentes

Acordeón

Documentación

Este é o corpo de acordeón do primeiro elemento. Está oculto por defecto, ata que o complemento de contraer engade as clases adecuadas que usamos para estilizar cada elemento. Estas clases controlan a aparencia xeral, así como a mostra e ocultación mediante transicións CSS. Podes modificar calquera cousa con CSS personalizado ou anulando as nosas variables predeterminadas. Tamén vale a pena notar que case calquera HTML pode ir dentro do .accordion-body, aínda que a transición limita o desbordamento.

This is the second item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.

Este é o corpo de acordeón do terceiro elemento. Está oculto por defecto, ata que o complemento de contraer engade as clases adecuadas que usamos para estilizar cada elemento. Estas clases controlan a aparencia xeral, así como a mostra e ocultación mediante transicións CSS. Podes modificar calquera cousa con CSS personalizado ou anulando as nosas variables predeterminadas. Tamén vale a pena notar que case calquera HTML pode ir dentro do .accordion-body, aínda que a transición limita o desbordamento.

Alertas

Documentación

Insignia

Documentación

Exemplo de títuloNovo

Exemplo de títuloNovo

Exemplo de títuloNovo

Exemplo de títuloNovo

Exemplo de títuloNovo

Exemplo de títuloNovo

Exemplo de títuloNovo

Exemplo de títuloNovo

Primaria Secundaria Éxito Perigo Aviso Información Luz Escuro

Botóns

Documentación

Tarxeta

Documentación
Placeholder Image cap
Título da tarxeta

Algún texto de exemplo rápido para construír o título da tarxeta e facer a maior parte do contido da tarxeta.

Vai a algún lado
Destacado
Título da tarxeta

Algún texto de exemplo rápido para construír o título da tarxeta e facer a maior parte do contido da tarxeta.

Vai a algún lado
hai 2 días
Título da tarxeta

Algún texto de exemplo rápido para construír o título da tarxeta e facer a maior parte do contido da tarxeta.

  • Un elemento
  • Un segundo elemento
  • Un terceiro elemento
Ligazón da tarxeta Outra ligazón
Placeholder Image
Título da tarxeta

Esta é unha tarxeta máis ampla con texto de apoio a continuación como un inicio natural de contido adicional. Este contido é un pouco máis longo.

Última actualización hai 3 minutos

Grupo de listas

Documentación
  • Un elemento desactivado
  • Un segundo elemento
  • Un terceiro elemento
  • Un cuarto elemento
  • E un quinto
  • Un elemento
  • Un segundo elemento
  • Un terceiro elemento
  • Un cuarto elemento
  • E un quinto
Un simple elemento de grupo de lista predeterminado Un simple elemento de grupo de lista principal Un elemento de grupo de lista secundario sinxelo Un simple elemento de grupo da lista de éxitos Un simple elemento de grupo da lista de perigos Un simple elemento de grupo de lista de avisos Un simple elemento de grupo de lista de información Un simple elemento de grupo de lista de luz Un simple elemento de grupo de lista escura

Popovers

Documentación

Scrollspy

Documentación

Primeiro título

Este é un contido de marcador de posición para a páxina scrollspy. Teña en conta que a medida que se despraza pola páxina, a ligazón de navegación adecuada aparece resaltada. Repítese ao longo do exemplo do compoñente. Seguimos engadindo algunha copia máis de exemplo aquí para enfatizar o desprazamento e o resaltado.

Segundo título

Este é un contido de marcador de posición para a páxina scrollspy. Teña en conta que a medida que se despraza pola páxina, a ligazón de navegación adecuada aparece resaltada. Repítese ao longo do exemplo do compoñente. Seguimos engadindo algunha copia máis de exemplo aquí para enfatizar o desprazamento e o resaltado.

Terceiro epígrafe

Este é un contido de marcador de posición para a páxina scrollspy. Teña en conta que a medida que se despraza pola páxina, a ligazón de navegación adecuada aparece resaltada. Repítese ao longo do exemplo do compoñente. Seguimos engadindo algunha copia máis de exemplo aquí para enfatizar o desprazamento e o resaltado.

Cuarto epígrafe

Este é un contido de marcador de posición para a páxina scrollspy. Teña en conta que a medida que se despraza pola páxina, a ligazón de navegación adecuada aparece resaltada. Repítese ao longo do exemplo do compoñente. Seguimos engadindo algunha copia máis de exemplo aquí para enfatizar o desprazamento e o resaltado.

Quinto epígrafe

Este é un contido de marcador de posición para a páxina scrollspy. Teña en conta que a medida que se despraza pola páxina, a ligazón de navegación adecuada aparece resaltada. Repítese ao longo do exemplo do compoñente. Seguimos engadindo algunha copia máis de exemplo aquí para enfatizar o desprazamento e o resaltado.

Spinners

Documentación

Torradas

Documentación

Suxestións sobre ferramentas

Documentación