admin
Cambiar el color del texto en una página web es fácil con la propiedad de color CSS.
Antes de ver cómo, es importante comprender las diferentes formas en que puede establecer el valor de la propiedad. Puedes usar:
- Nombres de colores HTML: Hay 140 nombres de colores admitidos en CSS. Amarillo, fucsia, granate y celeste son solo algunos ejemplos.
- Códigos hexadecimales de colores: estos códigos están compuestos por tres pares de caracteres que representan la intensidad de los tres colores primarios. Los valores posibles van desde 00 (la intensidad más baja de un color primario) hasta FF (la intensidad más alta de un color primario). El código de color hexadecimal para el negro es #000000, el rojo es #FF0000 y el azul es #0000FF.
- valores RGB: RGB es otro modelo de color basado en la combinación de los colores primarios rojo, verde y azul. Compuesto por tres números separados por comas, cada uno representa la intensidad del color primario respectivo como un número entero entre 0 y 255. El negro es rgb (0, 0, 0), el rojo es rgb (255, 0, 0) y el azul es RGB (0, 0, 255).
Si bien puede usar cualquiera de estos valores, no se recomiendan los nombres de color. No solo son difíciles de recordar más allá del arco iris estándar, sino que también introducen imprecisión. El fucsia de una persona puede ser el magenta de otra, el rosa intenso de otra, y así sucesivamente.
Para asegurarse de que el esquema de color de su sitio web se vea como usted desea, use códigos de color hexadecimales o valores RGB en su lugar. Le permiten elegir el tono exacto del color que desea. En los ejemplos a continuación, usaremos códigos de colores hexadecimales porque son más fáciles de aprender para principiantes.
Ahora veamos cómo cambiar el color y el color de fondo del texto en línea en CSS.
Cambiar el color del texto en línea en CSS
Para cambiar el color del texto en línea, vaya a la sección de su página web. Simplemente agregue el selector de CSS apropiado y defina la propiedad de color con el valor que desee. Por ejemplo, supongamos que desea cambiar el color de todos los párrafos de su sitio a azul marino. Entonces agregarías p {color: #000080; } a la sección principal de su archivo HTML.
Quizás se pregunte qué sucede si no establece la propiedad de color en su CSS. Buena pregunta. El color de texto predeterminado 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 en azul:
body {
color: blue;
}
Si no hay ningún selector de cuerpo o color definido en el selector de cuerpo, lo más probable es que el color predeterminado sea el negro.
Entonces, digamos que quiero cambiar el color de mis párrafos a azul marino, como se menciona en el ejemplo anterior, y todos los enlaces en mi sitio web a aguamarina. Entonces usaría el selector de tipo p y el selector de atributos a[href] y establezca la propiedad de color en #000080 y #00FFFF, respectivamente.
Aquí está el CSS:
p {
color: #000080;
}
a[href] {
color: #00FFFF;
}
Aquí está el HTML:
<p>This is a paragraph. The default text color was black, but I added a paragraph selector and defined the color property so it's navy.You'll see that the paragraph below is also navy, except for the link. Using a separate selector, the color of links has been changed to aqua.</p>
<p>Another paragraph that has <b><a href=" target="_blank">a link.</a></b></p>
Aquí está el resultado:
ver la pluma Cambiar el color del texto en línea en CSS de Christina Perricone (@hubspot) en CódigoPen.
Puede usar este mismo proceso para cambiar el color de los encabezados, las etiquetas de intervalo, la copia de botones y cualquier otro texto en una página. Ahora veamos cómo cambiar el color de fondo del texto.
Cambiar el color de fondo del texto en CSS
Para cambiar el color de fondo del texto en línea, vaya a la sección
de su página web. Simplemente agregue el selector de CSS apropiado y defina el color y la propiedad de color de fondo con los valores que desee. Di que quieres cambiar…
