7. Dimensiones
1440 x 900 px (screen size)
1440 x 828 px (viewport)
1280 x 828 px (design space)
8. Viewport & @media queries
/* Todos */
@media only screen { }
/* De Tablet a Smartphone */
@media only screen and (min-width: 768px) {}
/* Hasta 1280px de ancho */
@media only screen and (min-width: 1280px) {}
/* Hasta 1440px de ancho */
@media only screen and (min-width: 1440px) {}
/* Orientación apaisada */
@media only screen and (orientation: landscape) {}
/* Orientación Vertical */
@media only screen and (orientation: portrait) {}
9. Viewport & @media queries
/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {}
/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {}
/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {}
/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {}
/* Large screens ----------- */
@media tv and (min-device-width: 1152px) {}
@media tv and (min-device-width: 1728px) {}
/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {}
17. Ratón vs Dedo vs Trackpad
Wheel/Scroll
Wheel/Zoom
Click
Mouse Hover
Slide
Pinch
Tap
Swipe
Dos Dedos (Arriba-Abajo)
Pinch
Click
Dos Dedos (Izq-Der)
Mouse Hover
