Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprende Estilizado y Formato de Texto en Bootstrap | Conceptos Básicos
Esenciales de Bootstrap para Sitios Web Modernos

bookEstilizado y Formato de Texto en Bootstrap

Color de texto

Bootstrap proporciona un conjunto de clases utilitarias para aplicar colores de texto predefinidos a los elementos.

  • text-primary: Establece el color del texto a un color primario, normalmente un tono de azul;
  • text-secondary: Establece el color del texto a un color secundario, a menudo un tono de gris;
  • text-success: Establece el color del texto para indicar éxito, normalmente un tono de verde;
  • text-danger: Establece el color del texto para indicar peligro o error, a menudo un tono de rojo;
  • text-warning: Establece el color del texto para indicar advertencia, generalmente un tono de amarillo;
  • text-info: Establece el color del texto para transmitir información, a menudo un tono de cian o verde azulado;
  • text-light: Establece el color del texto a un tono más claro, normalmente gris claro o blanco;
  • text-dark: Establece el color del texto a un tono más oscuro, normalmente gris oscuro o negro;
  • text-muted: Establece el color del texto a un tono atenuado o apagado, a menudo gris claro, para indicar que el texto es menos importante o está deshabilitado.

Estas clases pueden aplicarse a elementos como <p>, <span>, <div>, <h>, etc.

index.html

index.html

copy

Transformación de texto

Clases como text-uppercase, text-lowercase, y text-capitalize transforman el texto.

  • text-uppercase: Convierte el texto a mayúsculas;
  • text-lowercase: Convierte el texto a minúsculas;
  • text-capitalize: Capitaliza la primera letra de cada palabra en el texto.
index.html

index.html

copy

Decoración de texto

Clases como text-decoration-underline, text-decoration-line-through y text-decoration-none se utilizan para decorar el texto.

  • text-decoration-underline: Añade un subrayado al texto;
  • text-decoration-line-through: Añade una línea a través del texto;
  • text-decoration-none: Elimina todas las decoraciones del texto.
index.html

index.html

copy

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 3. Capítulo 3

Pregunte a AI

expand

Pregunte a AI

ChatGPT

Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla

Awesome!

Completion rate improved to 3.23

bookEstilizado y Formato de Texto en Bootstrap

Desliza para mostrar el menú

Color de texto

Bootstrap proporciona un conjunto de clases utilitarias para aplicar colores de texto predefinidos a los elementos.

  • text-primary: Establece el color del texto a un color primario, normalmente un tono de azul;
  • text-secondary: Establece el color del texto a un color secundario, a menudo un tono de gris;
  • text-success: Establece el color del texto para indicar éxito, normalmente un tono de verde;
  • text-danger: Establece el color del texto para indicar peligro o error, a menudo un tono de rojo;
  • text-warning: Establece el color del texto para indicar advertencia, generalmente un tono de amarillo;
  • text-info: Establece el color del texto para transmitir información, a menudo un tono de cian o verde azulado;
  • text-light: Establece el color del texto a un tono más claro, normalmente gris claro o blanco;
  • text-dark: Establece el color del texto a un tono más oscuro, normalmente gris oscuro o negro;
  • text-muted: Establece el color del texto a un tono atenuado o apagado, a menudo gris claro, para indicar que el texto es menos importante o está deshabilitado.

Estas clases pueden aplicarse a elementos como <p>, <span>, <div>, <h>, etc.

index.html

index.html

copy

Transformación de texto

Clases como text-uppercase, text-lowercase, y text-capitalize transforman el texto.

  • text-uppercase: Convierte el texto a mayúsculas;
  • text-lowercase: Convierte el texto a minúsculas;
  • text-capitalize: Capitaliza la primera letra de cada palabra en el texto.
index.html

index.html

copy

Decoración de texto

Clases como text-decoration-underline, text-decoration-line-through y text-decoration-none se utilizan para decorar el texto.

  • text-decoration-underline: Añade un subrayado al texto;
  • text-decoration-line-through: Añade una línea a través del texto;
  • text-decoration-none: Elimina todas las decoraciones del texto.
index.html

index.html

copy

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 3. Capítulo 3
some-alt