1. Mainstream PC size

1024 1280 1366 1440 1680 1920

@media screen and(min-width: 1024px){} /*>=1024 */ @media screen and(min-width: 1024px){} /*>=1024 @media (min-width: 1280px) {} @media screen and(min-width: 1280px) {} @media screen and(min-width: 1280px) 1366px) {} @media screen and(min-width: 1440px) {} @media screen and(min-width: 1680px) {} @media screen and(min-width: 1920px) {}Copy the code

In min-width, the smaller ones are placed at the top and the larger ones at the bottom, and in max-width, the larger ones are placed at the top and the smaller ones are placed at the bottom

2. If it does not take effect, check whether meta tags exist

< meta name = "viewport" content = "width = device - width, initial - scale = 1.0" / >Copy the code