CSS响应式设计的通用断点设置

我在项目中使用的最佳 CSS 断点值。

在设计网站时，我发现自己在 CSS 断点中使用了很好的随机值。有时它是一个舍入值，如 800 或 1200，有时是一个特定的像素值，如 672。

我正在为未来的断点寻找一个合适的值。

我们负责 5 种主要设备尺寸：

这些设备结合了这些像素值：

• 640px以下
• > 640px
• > 768px
• > 1024px
• > 1280px

我不是设计师，所以我不会每天处理最佳实践，但这次我决定先设计手机。

这意味着我的CSS设计没有媒体查询用例用于移动肖像，然后添加断点并为越来越大的设备进行设计，禁用媒体查询最大宽度。

我似乎遵循了相反的路线：我为大屏幕设计，我使用最多的是大屏幕，然后是小屏幕，但为移动设备设计并使用最小宽度似乎是最被接受和使用的解决方案。眼下。

以下是我经常使用的媒体民意调查：

@media (min-width: 640px) {

}

@media (min-width: 768px) {

}

@media (min-width: 1024px) {

}

@media (min-width: 1280px) {

}