Sizes for Responsive website Design

问题

i want to design a web site.but tell me what are the sizes i can use for responsive website design. that sizes must contain for mobile,tablets,pcs and other devices..

i want to use them in media queries.. :D

EX for Mobile:

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

    }

EX for Tablet:

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

    }

Give me some resources that you have about responsive website design and about the sizes which i can use for responsive website design .. :D

like that i want to know what are the reals sizes for these devices that i can use. :D

回答1:

/* #1- Desktops */
@media (min-width: 980px) { ... }

/* #2- Portrait tablet to landscape and netbooks */
@media (min-width: 768px) and (max-width: 979px) { ... }

/* #3- Landscape phone to portrait tablet */
@media (max-width: 767px) { ... }

/* #4- Landscape phones and down */
@media (max-width: 480px) { ... }

For actual device specifications, check out this link by CSS-tricks..

回答2:

Here is the full list of media breakpoints

@media all and (max-width: 1690px) { ...}
@media all and (max-width: 1280px) { ...}
@media all and (max-width: 980px) { ... }
@media all and (max-width: 736px) { ... }
@media all and (max-width: 480px) { ... }

Check out for more informations about responsive device sizes : Medium

I hope so it's will help.

来源：https://stackoverflow.com/questions/18432532/sizes-for-responsive-website-design

标签

css