Valores de los colores en CSS
Vamos a poder asignar los colores a los atributos en las hojas de estilos de varias formas:
- Colores en hexadecimal
- Colores en hexadecimal reducido
- Colores RGB
- Nombre de colores predefinidos.
Además en CSS3 se va a incluir 3 nuevas formas de asignar colores. Se incluye un nuevo elemento como la opacidad o transparencia.
- Colores RGBA
- Colores HSL
- Colores HSLA
Colores hexadecimal
Es soportado por la mayoría de navegadores y es el más utilizado. Un color se forma por un carácter almoadilla # y 6 dígitos hexadecimales: #RRGGBB, donde RR corresponde a los valores del color rojo, GG al verde y BB al azul. Los valores del rojo azul y verde van desde el 00 al FF.
Ejemplo:
p
{
background-color:#ff0000;
}
<p> Los parrafos tienen fondo rojo</p>
Colores hexadecimal reducido
Es muy parecido al anterior, pero en lugar de utilizar dos dígitos hexadecimales para cada color se utiliza 1 (ff se reduce a f, 77 a 7, 00 a 0) . En total necesitamos 3 dígitos hexadecimales.
Ejemplo:
p
{
background-color:#f00;
}
<p> Los parrafos tienen fondo rojo</p>
Colores RGB
Es soportado por la mayoría de navegadores. Un color se define por rgb(rojo, verde, azul) donde cada color tiene un valor entre el 0 y 255 o un porcentaje del 0% al 100%.
Ejemplo:
p
{
background-color:rgb(255,0,0);
color:rgb(0,100%,0);
}
<p> Los parrafos tienen fondo rojo y el texto es de color verde</p>
Nombre de colores predefinidos.
Existen 141 nombres de colores predefinidos en la especificación de HTML y CSS. A los 17 estandar que hemos visto en HTML (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, and yellow) habría que añadir 124 (AliceBlue , MixAntiqueWhite,...etc.). En el Anexo 2 del libro se pueden ver los 141 nombres de colores junto a su correspondiente valor hexadecimal.