año nuevo, herramientas nuevas

José Leiva - @leivajd

AÑO NUEVO, HERRAMIENTAS NUEVASDRUPALEADA ENERO 2012

2011, CSS3, HTML5, RWD,WebFonts, y más

CSS3 magic!1!

Flash killer!2!

http://code.google.com/p/html5shim/

Web fonts3!

http://www.webtypography.net/

Salvadoras!4!

RWD5!

1. Fluid Grid2. Media Queries3. Imágenes, videos, fonts, flexibles.

.col1 { width: 6.25%;} /*60 / 960*/

.col2 { width: 14.58333333333333%;} /*140 / 960*/

.col3 { width: 22.91666666666667%; } /*220 / 960*/

@media screen and (max-width: 600px) { .class { background: transparent; }}

*Aplica si es menor a 600px.

@media only screen and (min-width: 768px) {

}

*Aplica si es mayor a 768px.

@media screen and (min-width: 600px) and (max-width: 900px) { .column { float: none; }}*Aplica si es entre 600px - 900px.

img,embed,object,video { max-width: 100%;}

h2 { margin-bottom: .75em; font-size : 2em; /* 36 / 16 = 2 */ line-height : 1.2; }

Mobile First

@media only screen and (min-width: 768px) {

}

*Aplica si es mayor a 768px.

Frameworks6!

Qué tal uno propio?