Logo Studenta
¡Este material tiene más páginas!

Vista previa del material en texto

Manejo de color
El uso de color en CSS puede emplearse de 4 maneras:
Palabras clave: red, yellow, black, etc.
Valores RGB: (red, green, blue) 
Sistema hexadecimal: #FFFFFF
Valores HSL: (hue, saturation, lightness)
Palabras clave
17 palabras clave (antes) 
140 (ahora) 
No todos los navegadores las soportan
RGB
Colores del monitor: red, green, blue
Valores de 0 a 255
.clase 
{color: rgb (255, 255, 0); }
Maneja canal alpha (opacidad/transparencia) 
Valores del .0 al 1.0
.clase 
{color: rgba (255, 0, 0, 1.0 ); }
RGBA
Porcentajes de hue, saturation y lightness
(tono, saturación y luminosidad)
Tono: rueda de color del 0 al 360
Saturación: del 0% al 100% color total
Lightness: 0% negro al 100% blanco
HSL
.clase 
{color: hsl (286, 44%, 87%); }
Añade el canal alpha
HSLA
.clase 
{color: hsla (286, 44%, 87%, 0.2); }
hexadecimal
Más común
Sistema numérico de 16 símbolos (números y letras)
Del 0 al 9, de la A a la F
#RRGGBB (determina los componentes RGB)
Operación matemática
#FFFFFF Blanco
#000000 Negro
#FF0000 Rojo
#00FF00 Verde
#0000FF Azul
#3F3F3F Gris 
# RRGGBB
Aplicar fondos de colores
1. Crear el estilo
.fondo1 
{background-color: #F6EABB; }
2. Aplicarlo al html en una etiqueta (body, div, table)
<div class=“fondo1”> 
</p > 
Texto con recuadro de color
</p > 
</div > 
Puedes obtener más herramientas para colores en los siguientes enlaces: 
W3schools. (s.f.). HTML Color Picker. Recuperado de https://bit.ly/2l9BWuY
HTML Color Codes. (s.f.). Los códigos de color de HTML. Recuperado de https://bit.ly/2CY6yJ7