Tutoriales de Informática y Dispositivos Móviles
Tutoriales de Informática y Dispositivos Móviles
Media Queries Dispositivos Móviles

Media Queries Dispositivos Móviles

Media Queries Dispositivos Móviles

En este tutorial veremos una lista de la mayoría de dispositivos y sus respectivos media queries para realizar diseños web responsive.

DISPOSITIVOS ACER

ACER ICONIA TAB A100

Acer Iconia Tab A100 (Vertical)

@media (max-device-width: 600px) 
and (orientation: portrait) {/*Aquí los estilos*/

Acer Iconia Tab A100 (Horizontal)

@media (max-device-width: 1024px) 
and (orientation: landscape) {/*Aquí los estilos*/

ACER ICONIA TAB A500

Acer Iconia Tab A500 (Vertical)

@media (max-device-width: 800px) 
and (orientation: portrait) {/*Aquí los estilos*/}

Acer Iconia Tab A500 (Horizontal)

@media (max-device-width: 1280px) 
and (orientation: landscape) {/*Aquí los estilos*/}

ACER ICONIA TAB A501

Acer Iconia Tab A501

@media only screen and (max-width : 800px) 
and (max-height : 1280px) {/*Aquí los estilos*/}

ACER LIQUID E2

Acer Liquid E2

@media only screen and (max-width : 360px) 
and (max-height : 640px) {/*Aquí los estilos*/}

DISPOSITIVOS ALCATEL

ALCATEL SMART MINI 875

Alcatel Smart Mini 875

@media only screen and (max-width : 320px) 
and (max-height : 480px) {/*Aquí los estilos*/}

ALCATEL ONE TOUCH 903

Alcatel One Touch 903

@media only screen and (max-width : 320px) 
and (max-height : 427px) {/*Aquí los estilos*/}

ALCATEL ONE TOUCH IDOL X

Alcatel One Touch Idol X

@media only screen and (max-width : 480px) 
and (max-height : 800px) {/*Aquí los estilos*/}

ALCATEL ONE TOUCH T10

Alcatel One Touch T10

@media only screen and (max-width : 480px) 
and (max-height : 800px) {/*Aquí los estilos*/}

DISPOSITIVOS APPLE

IPAD 1 Y 2

iPad 1 y 2 (Vertical y horizontal)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1) {/*Aquí los estilos*/}

iPad 1 y 2 (Vertical)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px) and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 1) {/*Aquí los estilos*/}

iPad 1 y 2 (Horizontal)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px) and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 1) {/*Aquí los estilos*/}

IPAD 3 Y 4

iPad 3 Y 4 (Vertical y horizontal)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 2) {/*Aquí los estilos*/}

iPad 3 Y 4 (Vertical)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (orientation : portrait) {/*Aquí los estilos*/}

iPad 3 Y 4 (Horizontal)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024)
and (orientation : portrait) {/*Aquí los estilos*/}

IPAD MINI

iPad mini (Vertical y horizontal)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1) {/*Aquí los estilos*/}

iPad mini (Vertical)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px) and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 1) {/*Aquí los estilos*/ }

iPad mini (Horizontal)

@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px) and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 1) {/*Aquí los estilos*/}

IPAD PRO 12.9"

iPad Pro 12.9″ (Vertical y horizontal)

@media only screen and (min-device-width: 1024px) 
and (max-device-width: 1366px)
and (-webkit-min-device-pixel-ratio: 2) {/*Aquí los estilos*/}

iPad Pro 12.9″ (Vertical)

@media only screen and (min-device-width: 1024px) 
and (max-device-width: 1024px) and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {/*Aquí los estilos*/}

iPad Pro 12.9″ (Horizontal)

@media only screen and (min-device-width: 1366px) 
and (max-device-width: 1366px) and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {/*Aquí los estilos*/}

IPHONE 2, 3 Y 4

iPhone 2, 3 y 4 (Vertical y horizontal)

@media only screen and (min-device-width : 320px) 
and (max-device-width : 480px) {/*Aquí los estilos*/}

iPhone 2, 3 y 4 (Vertical)

@media only screen and (min-device-width : 320px) 
and (max-device-width : 480px)
and (orientation : portrait) {/*Aquí los estilos*/ }

iPhone 2, 3 y 4 (Horizontal)

@media only screen and (min-device-width : 320px) 
and (max-device-width : 480px)
and (orientation : landscape) {/*Aquí los estilos*/}

IPHONE 5 Y 5s

iPhone 5 y 5s (Vertical y horizontal)

@media only screen and (min-device-width : 320px) 
and (max-device-width : 568px) {/*Aquí los estilos*/}

iPhone 5 y 5s (Vertical)

@media only screen and (min-device-width : 320px) 
and (max-device-width : 568px)
and (orientation : portrait) {/*Aquí los estilos*/ }

iPhone 5 y 5s (Horizontal)

@media only screen and (min-device-width : 320px) 
and (max-device-width : 568px)
and (orientation : landscape) {/*Aquí los estilos*/}

IPHONE 6, 7 Y 8 PLUS

iPhone 6, 7 y 8 (Vertical y horizontal)

@media only screen and (min-device-width : 375px) 
and (max-device-width : 667px) {/*Aquí los estilos*/}

iPhone 6, 7, 8 (Vertical)

@media only screen and (min-device-width : 375px) 
and (max-device-width : 667px)
and (orientation : portrait) {/*Aquí los estilos*/ }

iPhone 6, 7 y 8 (Horizontal)

@media only screen and (min-device-width : 375px) 
and (max-device-width : 667px)
and (orientation : landscape) {/*Aquí los estilos*/}

IPHONE 6, 7 Y 8 PLUS

iPhone 6, 7, y 8 Plus (Vertical y horizontal)

@media only screen and (min-device-width : 414px) 
and (max-device-width : 736px) {/*Aquí los estilos*/}

iPhone 6, 7 y 8 Plus (Vertical)

@media only screen and (min-device-width : 414px) 
and (max-device-width : 736px)
and (orientation : portrait) {/*Aquí los estilos*/ }

 

iPhone 6, 7 y 8 Plus (Horizontal)

@media only screen and (min-device-width : 414px) 
and (max-device-width : 736px)
and (orientation : landscape) {/*Aquí los estilos*/}

IPHONE X

iPhone X (Vertical y horizontal

@media only screen and (min-device-width : 375px) 
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3) {/*Aquí los estilos*/}

iPhone X (Vertical)

@media only screen and (min-device-width : 375px) 
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3)
and (orientation : portrait) {/*Aquí los estilos*/}

iPhone X (Horizontal)

@media only screen and (min-device-width : 375px) 
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape) {/*Aquí los estilos*/}

DISPOSITIVOS ASUS

ASUS NEXUS 7

Asus Nexus 7 (Vertical y horizontal)

@media screen and (device-width: 601px) 
and (device-height: 906px) 
and (-webkit-min-device-pixel-ratio: 1.331) 
and (-webkit-max-device-pixel-ratio: 1.332) {/*Aquí los estilos*/}

Asus Nexus 7 (Vertical)

@media screen and (device-width: 601px) 
and (device-height: 906px) 
and (-webkit-min-device-pixel-ratio: 1.331) 
and (-webkit-max-device-pixel-ratio: 1.332) 
and (orientation: portrait) {/*Aquí los estilos*/}

Asus Nexus 7 (Horizontal)

@media screen and (device-width: 601px) 
and (device-height: 906px) 
and (-webkit-min-device-pixel-ratio: 1.331) 
and (-webkit-max-device-pixel-ratio: 1.332) 
and (orientation: landscape) {/*Aquí los estilos*/}

ASUS NEXUS 9

Asus Nexus 9 (Vertical y horizontal)

@media screen and (device-width: 1536px) 
and (device-height: 2048px)
and (-webkit-min-device-pixel-ratio: 1.331)
and (-webkit-max-device-pixel-ratio: 1.332) {/*Aquí los estilos*/}

Asus Nexus 9 (Vertical)

@media screen and (device-width: 1536px) 
and (device-height: 2048px)
and (-webkit-min-device-pixel-ratio: 1.331)
and (-webkit-max-device-pixel-ratio: 1.332)
and (orientation: portrait) {/*Aquí los estilos*/}

Asus Nexus 9 (Horizontal)

@media screen and (device-width: 1536px) 
and (device-height: 2048px)
and (-webkit-min-device-pixel-ratio: 1.331)
and (-webkit-max-device-pixel-ratio: 1.332)
and (orientation: landscape) {/*Aquí los estilos*/}

DISPOSITIVOS HTC

HTC ONE

HTC One (Vertical y horizontal)

@media screen 
and (device-width: 360px) 
and (device-height: 640px) 
and (-webkit-device-pixel-ratio: 3) {/*Aquí los estilos*/}

HTC One (Vertical)

@media screen 
and (device-width: 360px) 
and (device-height: 640px) 
and (-webkit-device-pixel-ratio: 3) 
and (orientation: portrait) {/*Aquí los estilos*/}

HTC One (Horizontal)

@media screen 
and (device-width: 360px) 
and (device-height: 640px) 
and (-webkit-device-pixel-ratio: 3) 
and (orientation: landscape) {/*Aquí los estilos*/}

HTC ONE MINI

HTC One Mini

@media only screen and (max-width : 360px) 
and (max-height : 640px) {/*Aquí los estilos*/}

HTC ONE A9

HTC One A9

@media only screen and (max-width : 1080px) 
and (max-height : 1920px) {/*Aquí los estilos*/}

HTC 10

HTC 10

@media only screen and (max-width : 1440px) 
and (max-height : 2560px) {/*Aquí los estilos*/}

DISPOSITIVOS KINDLE

KINDLE FIRE HD 7

Kindle Fire Hd 7″ (Vertical y horizontal)

@media only screen 
and (min-device-width: 800px) 
and (max-device-width: 1280px) 
and (-webkit-min-device-pixel-ratio: 1.5) {/*Aquí los estilos*/}

Kindle Fire Hd 7″ (Vertical)

@media only screen 
and (min-device-width: 800px) 
and (max-device-width: 1280px) 
and (-webkit-min-device-pixel-ratio: 1.5) 
and (orientation: portrait) {/*Aquí los estilos*/}

Kindle Fire Hd 7″ (Horizontal)

@media only screen 
and (min-device-width: 800px) 
and (max-device-width: 1280px) 
and (-webkit-min-device-pixel-ratio: 1.5) 
and (orientation: landscape) {/*Aquí los estilos*/}

KINDLE FIRE HD 8.9

Kindle Fire Hd 8.9″ (Vertical y horizontal)

@media only screen 
and (min-device-width: 1200px) 
and (max-device-width: 1600px) 
and (-webkit-min-device-pixel-ratio: 1.5) {/*Aquí los estilos*/}

Kindle Fire Hd 8.9″ (Vertical)

@media only screen and (min-device-width: 1200px) 
and (max-device-width: 1600px) 
and (-webkit-min-device-pixel-ratio: 1.5) 
and (orientation: portrait) {/*Aquí los estilos*/}

Kindle Fire Hd 8.9″ (Horizontal)

@media only screen and (min-device-width: 1200px) 
and (max-device-width: 1600px) 
and (-webkit-min-device-pixel-ratio: 1.5) 
and (orientation: landscape) {/*Aquí los estilos*/}

DISPOSITIVOS LENOVO

LENOVO IDEAPAD K1

Lenovo IdeaPad K1 (Vertical)

@media (max-device-width: 800px) 
and (orientation: portrait) {/*Aquí los estilos*/}

Lenovo IdeaPad K1 (Horizontal)

@media (max-device-width: 1280px) 
and (orientation: landscape) {/*Aquí los estilos*/}

LENOVO IDEATAB A1000

Lenovo IdeaTab A1000

@media only screen and (max-width : 600px) 
and (max-height : 1024px) {/*Aquí los estilos*/}

LENOVO IDEATAB S6000

Lenovo IdeaTab S6000

@media only screen and (max-width : 800px) 
and (max-height : 1280px) {/*Aquí los estilos*/}

LENOVO YOGA TABLET 10

Lenovo Yoga Tablet 10

@media only screen and (max-width : 800px) 
and (max-height : 1280px) {/*Aquí los estilos*/}

LENOVO YOGA TABLET 8

Lenovo Yoga Tablet 8

@media only screen and (max-width : 602px) 
and (max-height : 962px) {/*Aquí los estilos*/}

DISPOSITIVOS LG

LG G5

Lg G5

@media only screen and (max-width : 1440px) 
and (max-height : 2560px) {/*Aquí los estilos*/}

LG OPTIMUS 2X

Lg Optimus 2x

@media only screen and (max-width : 320px) 
and (max-height : 533px) {/*Aquí los estilos*/}

LG OPTIMUS BLACK P970

Lg Optimus Black P970

@media only screen and (max-width : 320px) 
and (max-height : 533px) {/*Aquí los estilos*/}

LG OPTIMUS L7

Lg Optimus L7

@media only screen and (max-width : 320px) 
and (max-height : 533px) {/*Aquí los estilos*/}

LG OPTIMUS L9 P760

Lg Optimus L9 P760

@media only screen and (max-width : 360px) 
and (max-height : 640px) {/*Aquí los estilos*/}

LG OPTIMUS PAD V900

Lg Optimus Pad V900

@media only screen and (max-width : 768px) 
and (max-height : 1280px) {/*Aquí los estilos*/}

DISPOSITIVOS SAMSUNG

GALAXY S2

Galaxy S2

@media screen and (device-width: 320px) 
and (device-height: 533px)
and (-webkit-device-pixel-ratio: 1.5) {/*Aquí los estilos*/}

GALAXY S3

Galaxy S3 (Vertical y horizontal)

@media screen and (device-width: 320px) 
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 2) {/*Aquí los estilos*/}

Galaxy S3 (Vertical)

@media screen   and (device-width: 320px) 
and (device-height: 640px) and (-webkit-device-pixel-ratio: 2)
and (orientation: portrait) {/*Aquí los estilos*/}

Galaxy S3 (Horizontal)

@media screen and (device-width: 320px) 
and (device-height: 640px) and (-webkit-device-pixel-ratio: 2)
and (orientation: landscape) {/*Aquí los estilos*/}

GALAXY NOTE 2

Galaxy Note 2

@media only screen and (max-width : 360px) 
and (max-height : 640px) {/*Aquí los estilos*/}

GALAXY S4, S5 Y NOTE3

Galaxy S4, S5 y Note3 (Vertical y horizontal)

@media screen and (device-width: 320px) 
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3) {/*Aquí los estilos*/}

Galaxy S4, S5 y Note 3 (Vertical)

@media screen and (device-width: 320px) 
and (device-height: 640px) and (-webkit-device-pixel-ratio: 3)
and (orientation: portrait) {/*Aquí los estilos*/}

Galaxy S4, S5 y Note3 (Horizontal)

@media screen and (device-width: 320px) 
and (device-height: 640px) and (-webkit-device-pixel-ratio: 3)
and (orientation: landscape) {/*Aquí los estilos*/}

GALAXY S6

Galaxy S6 (Vertical y horizontal)

@media screen   and (device-width: 360px) 
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 4) {/*Aquí los estilos*/}

Galaxy S6 (Vertical)

@media screen   and (device-width: 360px) 
and (device-height: 640px) and (-webkit-device-pixel-ratio: 4)
and (orientation: portrait) {/*Aquí los estilos*/}

Galaxy S6 (Horizontal)

@media screen and (device-width: 360px) 
and (device-height: 640px) and (-webkit-device-pixel-ratio: 4)
and (orientation: landscape) {/*Aquí los estilos*/}

GALAXY S6 EDGE

Galaxy S6 Edge

@media only screen and (max-width: 1440px) 
and (max-height: 2560px) {/*Aquí los estilos*/}

GALAXY S7 Y S7 EDGE

Galaxy S7 Y S7 Edge

@media only screen and (max-width: 1440px) 
and (max-height: 2560px) {/*Aquí los estilos*/}

GALAXY NOTE 8 N5100

Galaxy Note 8 N5100

@media only screen and (max-width : 601px) 
and (max-height : 962px) {/*Aquí los estilos*/}

GALAXY NOTE 8 N5110

Galaxy Note 8 N5110

@media only screen and (max-width : 601px) 
and (max-height : 962px) {/*Aquí los estilos*/}

GALAXY TAB 10.1

Galaxy Tab 10.1 (Vertical y horizontal)

@media (min-device-width: 800px)     
and (max-device-width: 1280px) {/*Aquí los estilos*/}

Galaxy Tab 10.1 (Vertical)

@media (max-device-width: 800px) 
and (orientation: portrait) {/*Aquí los estilos*/}

Galaxy Tab 10.1 (Horizontal)

@media (max-device-width: 1280px) 
and (orientation: landscape) {/*Aquí los estilos*/}

GALAXY TAB 2

Galaxi Tab 2 (Vertical y horizontal)

@media (min-device-width: 800px) 
and (max-device-width: 1280px) {/*Aquí los estilos*/}

Galaxy Tab 2 (Vertical)

@media (max-device-width: 800px) 
and (orientation: portrait) {/*Aquí los estilos*/}

Galaxy Tab 2 (Horizontal)

@media (max-device-width: 1280px) 
and (orientation: landscape) {/*Aquí los estilos*/}

GALAXY TAB 3 10.1 P5210

Galaxi Tab 3 10.1 P5210

@media only screen and (max-width : 800px) 
and (max-height : 1280px) {/*Aquí los estilos*/}

GALAXY TAB 3 7.0 T210

Galaxi Tab 3 7.0 T210

@media only screen and (max-width : 600px) 
and (max-height : 1024px) {/*Aquí los estilos*/}

GALAXY TAB 5

Galaxy Tab 5 (Vertical y horizontal)

@media (min-device-width: 800px) 
and (max-device-width: 1280px)
and (-webkit-min-device-pixel-ratio: 2) {/*Aquí los estilos*/}

Galaxy Tab 5 (Vertical)

@media (max-device-width: 800px) 
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {/*Aquí los estilos*/}

Galaxy Tab 5 (Horizontal)

@media (max-device-width: 1280px) 
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {/*Aquí los estilos*/}

DISPOSITIVOS SONY

SONY XPERIA Z5

Sony Xperia Z5

@media only screen and (max-width: 1080px) 
and (max-height: 1280px) {/*Aquí los estilos*/}

SONY XPERIA Z5 PREMIUM

Sony Xperia Z5 Premium

@media only screen and (max-width: 2160px) 
and (max-height: 3840px) {/*Aquí los estilos*/}

SONY XPERIA TABLET Z

Sony Xperia Tablet Z

@media only screen and (max-width : 800px) 
and (max-height : 1280px) {/*Aquí los estilos*/}

SMARTWATCHES

APPLE WATCH

Apple Watch

@media (max-device-width: 42mm)
and (min-device-width: 38mm) {/*Aquí los estilos*/}

MOTOROLA MOTO 360

Moto 360

@media (max-device-width: 218px)
and (max-device-height: 281px) {/*Aquí los estilos*/}

Si te ha gustado no olvides compartir en redes sociales.

[addthis tool=»addthis_inline_share_toolbox_6jt6″]

Espero que te haya servido. Cualquier duda deja un comentario. Un saludo

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Translate »