If you can't read please download the document
Upload
flavia-siqueira
View
958
Download
1
Embed Size (px)
DESCRIPTION
Apresentando um pouco do que há de novo no CSS3
Citation preview
2. 3. Novas propriedades do CSS3 Bordas
5.
7.
8. Cor
A declarao de cores com uso de HSL (hue, saturation, lightness) permite que voc declare as cores com uso dos seus trs componentes: hue = tom, saturation = saturao e lightness = luminosidade. Seletor { color: hsl (120, 75%, 50%) } O primeiro valor para o tom (hue) da cor.
15. O segundo valor para a saturao (saturation) da cor. O seu valor expresso em porcentagem. Um valor igual a 100% representa saturao total da cor e 0 um leve sombreado cinza de saturao. O terceiro valor para a luminosidade (lightness). O seu valor expresso em porcentagem. Um valor igual a 100% resulta em cor branca e 0 em cor preta, sendo 50% o valor normal. 1.* { color: hsl(0, 100%, 50%) } /* vermelho */ 2.* { color: hsl(120, 100%, 50%) } /* verde */ 3.* { color: hsl(120, 100%, 25%) } /* verde escuro */ 4.* { color: hsl(120, 100%, 75%) } /* verde claro */ 5.* { color: hsl(120, 75%, 75%) } /* verde pastel */ 16.
A declarao de cores com uso de HSLA (hue, saturation, lightness, alpha-opacity) uma maneira estendida da declarao HSL na qual um quarto argumento define a opacidade da cor. Este quarto argumento um nmero decimal entre 0 e 1. 17. Texto
#000 = cor 2px = distncia horizontal 3px = distncia vertical 2px = raio da sombra #000 = cor 0.2em = distncia horizontal 0.3em = distncia vertical 0.2em = raio da sombra 18. Mltiplas sombras e valores negativos text-shadow: #000 1px 1px 1px, #FFF -1px -1px 1px; -webkit-text-shadow: para Safari -moz-text-shadow: para Firefox At o momento o IE no suporta o CSS3 19. Box
20. Cuidado com os exageros... 21. 22.