0% found this document useful (0 votes)
106 views1 page

Media Queries Breakpoints

This document provides simple guidelines for defining media query breakpoints for different screen sizes, including smartphones from 320px to 600px width, tablets from 600px to 1024px, and laptops and desktops above 1024px. It lists recommended minimum width media queries for common device categories like smartphones, tablets, laptops and desktops. It also includes URLs for more information on media queries and standard device breakpoints.

Uploaded by

María del Mar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
106 views1 page

Media Queries Breakpoints

This document provides simple guidelines for defining media query breakpoints for different screen sizes, including smartphones from 320px to 600px width, tablets from 600px to 1024px, and laptops and desktops above 1024px. It lists recommended minimum width media queries for common device categories like smartphones, tablets, laptops and desktops. It also includes URLs for more information on media queries and standard device breakpoints.

Uploaded by

María del Mar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

Media Queries Breakpoints

Ideas sencillas para orientarnos en definir los puntos de ruptura:

@media (min-width:320px) { /* smartphones, portrait iPhone, portrait 480x320 phones


(Android) */ }
@media (min-width:480px) { /* smartphones, Android phones, landscape iPhone */ }
@media (min-width:600px) { /* portrait tablets, portrait iPad, e-readers
(Nook/Kindle), landscape 800x480 phones (Android) */ }
@media (min-width:801px) { /* tablet, landscape iPad, lo-res laptops ands desktops */
}
@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ }
@media (min-width:1281px) { /* hi-res laptops and desktops */ }

URLs de interés:

https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

https://responsivedesign.is/develop/browser-feature-support/media-queries-for-common-
device-breakpoints/

You might also like