Treinamento front-end | Equipe de Três de Maio

Ministrante: Sergio Andrade | Maio de 2014

http://www.sergioandra.de

---

###Responsive Web Desing:

• Metatag Viewport

 <meta name="viewport" content="width=device-width, initial-scale=1">

• Medidas fluídas

.content{
    display: block;
    width: 94%;
    margin: 0 auto;
    max-width: 1920px;
    min-width: 200px;
    font-size: 0,75em /*12px*/

}

• Media queries
• Aspect ratio com css

###Padrões de desenvolvimento:

• Padrões de Código, plugins, estruturas e sprites
• SpriteCow
• Pré Processadores (Sass)
• CSS inline
• Novas Tags de HTML5
• Labels nos inputs
• Position x Float

###Features aleatórias:

• Pseudo elementos (before, after, first:child, last:child)
• CSS3 Transitions
• Reflows (float:left em imagens, font-size: 0 em display: inline-block)

###Links interessantes:

• http://www.minimamente.com/example/magic_animations/
• http://daneden.github.io/animate.css/
• http://ianlunn.github.io/Hover/
• http://ricostacruz.com/jquery.transit/
• http://fontawesome.io/icons/
• https://developer.mozilla.org/en-US/docs/Web/CSS
• http://clovisdasilvaneto.github.io/all-animation/
• http://tympanus.net/codrops/
• http://css-tricks.com/
• http://tableless.com.br/
• http://www.javascriptoo.com/