Cambiar color de letra html css

texto css en negrita

El uso del color es una forma fundamental de expresión humana. Los niños experimentan con el color incluso antes de tener la destreza manual para dibujar. Quizá por eso el color es una de las primeras cosas con las que la gente suele querer experimentar cuando aprende a desarrollar sitios web. Con CSS, hay muchas maneras de añadir color a tus elementos HTML para crear el aspecto que deseas.

Vamos a tocar la mayor parte de lo que necesitarás saber cuando uses el color, incluyendo una lista de lo que puedes colorear y qué propiedades CSS están involucradas, cómo describir los colores, y cómo usar realmente los colores tanto en las hojas de estilo como en los scripts. También veremos cómo dejar que el usuario elija un color.

Luego terminaremos con una breve discusión sobre cómo usar el color sabiamente: cómo seleccionar los colores apropiados, teniendo en cuenta las necesidades de las personas con diferentes capacidades visuales.Cosas que pueden tener colorA nivel de elementos, todo en HTML puede tener color aplicado. En cambio, vamos a ver las cosas en términos de los tipos de cosas que se dibujan en los elementos, como el texto y los bordes, etc. Para cada uno, veremos una lista de las propiedades CSS que les aplican color.

estilo de fuente html

colorLa propiedad CSS color establece el valor del color de primer plano del texto y las decoraciones de texto de un elemento, y establece el valor de <currentcolor>. currentcolor puede utilizarse como valor indirecto en otras propiedades y es el valor predeterminado para otras propiedades de color, como border-color.

Cuestiones de accesibilidadEs importante asegurarse de que la relación de contraste entre el color del texto y el fondo sobre el que se coloca el texto sea lo suficientemente alta como para que las personas con problemas de visión puedan leer el contenido de la página.

La relación de contraste del color se determina comparando los valores de luminosidad del texto y del color de fondo. Para cumplir las actuales Directrices de Accesibilidad al Contenido en la Web (WCAG), se requiere una relación de 4,5:1 para el contenido del texto y de 3:1 para el texto de mayor tamaño, como los encabezados. El texto grande se define como de 18,66px y en negrita o más, o de 24px o más.

enlace color css

La propiedad CSS color establece el valor del color de primer plano del texto y de las decoraciones de texto de un elemento, y establece el valor de <currentcolor>. currentcolor puede utilizarse como valor indirecto en otras propiedades y es el valor por defecto de otras propiedades de color, como border-color.

Es importante asegurarse de que la relación de contraste entre el color del texto y el fondo sobre el que se coloca el texto sea lo suficientemente alta como para que las personas con problemas de visión puedan leer el contenido de la página.

La relación de contraste del color se determina comparando los valores de luminosidad del texto y del color de fondo. Para cumplir las actuales Directrices de Accesibilidad al Contenido en la Web (WCAG), se requiere una relación de 4,5:1 para el contenido del texto y de 3:1 para el texto de mayor tamaño, como los títulos. El texto grande se define como 18,66px y negrita o más, o 24px o más.

<color>donde <color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hwb()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>donde <rgb()> = rgb( <percentage>{3} [ / <alpha-value> ]? ) | rgb( <número>{3} [ / <valor-alfa> ]? ) | rgb( <porcentaje>#{3} , <valor-alfa>? ) | rgb( <número>#{3} , <valor-alfa>? )<rgba()> = rgba( <porcentaje>{3} [ / <valor-alfa> ]? ) | rgba( <número>{3} [ / <valor-alfa> ]? ) | rgba( <porcentaje>#{3} , <valor-alfa>? ) | rgba( <número>#{3} , <valor-alfa>? )<hsl()> = hsl( <tono> <porcentaje> <porcentaje> [ / <valor-alfa> ]? )<hsla()> = hsla( <tono> <porcentaje> <porcentaje> [ / <valor-alfa> ]? )| hsla( <tono>, <porcentaje>, <porcentaje>, <valor-alfa>? )<hwb()> = hwb( [<tono> | ninguno] [<porcentaje> | ninguno] [<porcentaje> | ninguno] [ / [valor-alfa> | ninguno]? )donde <valor-alfa> = <número> | <porcentaje> = <número> | <ángulo>

color de texto html

Aunque puede utilizar cualquiera de estos valores, no se recomienda utilizar nombres de colores. No sólo son difíciles de recordar más allá del arco iris estándar, sino que también introducen imprecisiones. El fucsia de una persona puede ser el magenta de otra, el rosa fuerte de otra, y así sucesivamente. Para asegurarse de que la combinación de colores de su sitio web tiene el aspecto que desea, utilice en su lugar códigos de color hexadecimales o valores RGB. Te permiten elegir el tono exacto del color que quieres. En los ejemplos siguientes, utilizaremos los códigos de color hexadecimales porque son más fáciles de aprender para los principiantes. Ahora vamos a ver cómo cambiar el color y el color de fondo del texto en línea en CSS.

Tal vez te preguntes qué pasa si no estableces la propiedad de color en tu CSS. Esa es una buena pregunta. El color de texto por defecto para una página se define en el selector de cuerpo. Aquí hay un ejemplo de un selector de cuerpo que establece el color del texto como azul:

<p>Este es un párrafo. El color de texto por defecto era negro, pero he añadido un selector de párrafo y he definido la propiedad de color para que sea azul marino.Verás que el párrafo de abajo también es azul marino, excepto el enlace. Usando un selector separado, el color de los enlaces ha sido cambiado a aqua.</p>