1. Workshop { CSS 3 }
Por Anderson de Castro

2. { AGENDA }
O que é CSS?
Seletores
-
Gradiente
Columns
Transform 2D
Transições
Animações
-
Bordas
Cores
Fontes

3. { O que é CSS ? }
“Cascading Style Sheets (CSS) is a simple
mechanism for adding style (e.g., fonts,
colors, spacing) to Web documents. ”
W3C

4. { Seletores }
Estruturas que determinam quais elementos
serão formatados.

5. { Gradiente }
“ ?-linear-gradient(cor1, cor2, percent) ”

6. { Column }
-?-column-count
-?-column-width
-?-column-gap

7. { Transform 2D }
Scale
Skew
Translation
Rotate
Origin

8. { Animation }
Transition
KeyFrame Rule

9. { Animation :: Propriedades }
animation-name
Animation-duration (em Segundos)
Animation-timing-function (default:ease)
Animation-interation-count (infinite, 1)
Animation-direction (normal / alternate)
Animation-play-state (running / paused)
Animation-delay

10. { ShortCode }
animation: [<animation-name> || <animation-
duration> || <animation-timing-function> ||
<animation-delay> || <animation-iteration-count> ||
<animation-direction>] [, [<animation-name> ||
<animation-duration> || <animation-timing-
function> || <animation-delay> || <animation-
iteration-count> || <animation-direction>] ]*

11. { Ciclos }

12. { Fontes }
@font-face