The document contains various CSS properties and techniques, including viewport units, background properties, box models, and flexbox. It references multiple links for further information on advanced CSS features like gradients, shadows, and responsive design. Additionally, it includes contact information for Elcio Ferreira.

1. Yes we can!Yes we can!

3. vw / vhvw / vh
vmin / vmaxvmin / vmax

4. Entre os nossos clientes:Entre os nossos clientes:
93,63% - Navegadores de Verdade
4,64% - Internet Explorer 10 e 11
1,73% - Internet Explorer 9 ou menor

5. IE 8 morreuIE 8 morreu
IE 9 subiu no telhadoIE 9 subiu no telhado

6. ::placeholder::placeholder

7. https://css-tricks.com/snippets/https://css-tricks.com/snippets/
css/style-placeholder-text/css/style-placeholder-text/

8. CountersCounters

9. http://davidwalsh.name/css-couhttp://davidwalsh.name/css-cou
ntersnters

10. Background position edgesBackground position edges

11. background-position:background-position:
bottom 50px right 20pxbottom 50px right 20px

12. Background sizeBackground size

13. background-size: 20px 30px;background-size: 20px 30px;
background-size: contain;background-size: contain;
background-size: cover;background-size: cover;

14. https://css-tricks.com/almanachttps://css-tricks.com/almanac
/properties/b/background-size//properties/b/background-size/

15. Multiple backgroundsMultiple backgrounds

16. http://www.css3.info/preview/http://www.css3.info/preview/
multiple-backgrounds/multiple-backgrounds/

17. Box-shadowBox-shadow

18. http://www.cssmatic.com/boxhttp://www.cssmatic.com/box
-shadow-shadow

19. RGBARGBA

20. http://tableless.com.br/css3-bhttp://tableless.com.br/css3-b
reve-introducao-a-rgba/reve-introducao-a-rgba/

21. GradientesGradientes

22. http://www.colorzilla.com/gradhttp://www.colorzilla.com/grad
ient-editor/ient-editor/

23. Text-shadowText-shadow

24. Text-shadow
Text-shadow
Text-shadow
Text-shadow
Text-shadow
Text-shadow

25. min-width / max-widthmin-width / max-width
min-height / max-heightmin-height / max-height

26. .slide {.slide {
width: 100vw;width: 100vw;
height: 100vh;height: 100vh;
}}

27. #quadrado {#quadrado {
width: 90vmin;width: 90vmin;
height: 90vmin;height: 90vmin;
}}

28. remrem
http://tableless.com.br/unidadhttp://tableless.com.br/unidad
e-pixels-em-rem/e-pixels-em-rem/

29. box-sizingbox-sizing

30. http://www.binvisions.com/artihttp://www.binvisions.com/arti
cles/box-sizing-property-diffecles/box-sizing-property-diffe
rence-content-border/rence-content-border/

31. ColunasColunas

32. http://www.css3.info/preview/http://www.css3.info/preview/
multi-column-layout/multi-column-layout/

33. CálculosCálculos

34. http://www.maujor.com/tutorialhttp://www.maujor.com/tutorial
/css3-funcao-css-calc.php/css3-funcao-css-calc.php
div {div {
width: calc(50% - 100px);width: calc(50% - 100px);
height: calc(100vh - 50px);height: calc(100vh - 50px);
}}

35. FlexboxFlexbox

36. https://css-tricks.com/snippets/https://css-tricks.com/snippets/
css/a-guide-to-flexbox/css/a-guide-to-flexbox/

37. Que mais?Que mais?

38. Mais:Mais:
OutlineOutline
word-break: break-allword-break: break-all
text-overflowtext-overflow
TransformaçõesTransformações

39. Mais:Mais:
border-radiusborder-radius
::before e ::after::before e ::after
Transições e animaçõesTransições e animações

40. Elcio FerreiraElcio Ferreira
elcio@visie.com.brelcio@visie.com.br
twitter: @elciotwitter: @elcio
http://elcio.com.br/http://elcio.com.br/