(Responsive PC-side media Query) computer screen resolution size Daquan

PC-Side

Sort by screen width (mainstream orange)

Resolution Scale | Equipment size

1024*500 (8.9 inch)

1024x768 (ratio 4:3 | 10.4-inch, 12.1-inch, 14.1-inch, 15-inch; ）

1280*800 (16:10 |15.4 inch)

1280*1024 (Scale: 5:4 | 14.1 ", 15.0")

1280*854 (scale: 15:10 | 15.2)

1366*768 (scale: 16:9 | uncommon)

1440*900 (16:10 17 inch only for apples)

1440*1050 (Scale: 5:4 | 14.1 ", 15.0")

1600*1024 (14:9 uncommon)

1600*1200 (4:3 | 15, 16.1)

1680*1050 (16:10 | 15.4 ", 20.0")

1920*1200 (23 inch)

Through the above computer screen and size of the example table we got a few widths

1024 1280 1366 1440 1680 1920

PC-side Responsive media breakpoints

CSS Code

@media (min-width:1024px) {
BODY{FONT-SIZE:18PX}
}/*>=1024 's Device */

@media (min-width:1100px) {
body{font-size:20px}
}/*>=1024 's Device */
@media (min-width:1280px) {
body{font-size:22px;}
}

@media (min-width:1366px) {

body{font-size:24px;}
}

@media (min-width:1440px) {
body{font-size:25px!important;}
}

@media (min-width:1680px) {
body{font-size:28px;}
}
@media (min-width:1920px) {
body{font-size:33px;}
}

When using the min-width, small put above the big in below, similarly if is with Max-width then is big in above, small in below

In addition, when looking for information to find Google browser plugin Window Resizer (Firefox users can search Firesizer) can call various types of resolution size to see the effect

(Responsive PC-side media Query) computer screen resolution size Daquan