Colores
Transmita significado a través del color con un puñado de clases de utilidad de color. También incluye soporte para diseñar enlaces con estados de desplazamiento.
Lidiar con la especificidad
A veces, las clases contextuales no se pueden aplicar debido a la
especificidad de otro selector.
En algunos casos, una solución alternativa suficiente es envolver el
contenido de su elemento en un
<div>
con la clase.
Transmitir significado a las tecnologías de asistencia
El uso del color para agregar significado solo proporciona una indicación
visual, que no se transmitirá a los usuarios de tecnologías de asistencia, como los lectores de pantalla.
Asegúrese de que la información indicada por el color sea obvia a partir del contenido en sí (por ejemplo, el
texto visible) o se incluya a través de medios alternativos, como texto adicional oculto con la
.sr-only
clase.
Color
.text-primary
.text-secundario
.text-tertiary
.text-éxito
.text-peligro
.text-warning
.text-info
.text-light
.text-dark
.text-body
.text-muted
.text-blanco
.text-negro-50
.text-blanco-50
Las clases de texto contextual también funcionan bien en anclajes con los
estados de desplazamiento y enfoque proporcionados.
Tenga en cuenta que la
clase
.text-white
y
.text-muted
no tiene un estilo de enlace adicional más allá del subrayado.
Color de fondo
De manera similar a las clases de color de texto contextual, configure
fácilmente el fondo de un elemento en cualquier clase contextual.
Los componentes de ancla se oscurecerán al pasar el mouse, al igual que las
clases de texto.
Las utilidades en segundo plano
no se configuran
color
, por lo que en algunos casos querrá utilizar
.text-*
utilidades.
Gradiente de fondo
Cuando
$enable-gradients
se establece en
true
(el valor predeterminado es
false
), puede usar
.bg-gradient-
clases de utilidad.
Conozca nuestras opciones de Sass
para habilitar estas clases y más.
.bg-gradient-primary
.bg-gradient-secondary
.bg-gradient-success
.bg-gradient-danger
.bg-gradient-warning
.bg-gradient-info
.bg-gradient-light
.bg-gradient-dark