媒体查询最小宽度不考虑低于一定宽度的设备
Media query min-width not considering devices below a certain width
当设备宽度小于“375”（我的最小断点）时，为什么有些设备不听我的媒体查询。我使用@media (min-width: 375px) { // Rules here }...我知道 "requires" 设备必须至少有“375px”宽，但我不知道是什么这里错了。当我将 375 断点更改为 0px 时它起作用了...但这是否是正确的方法？
在我的 "media.scss" 文件中，我的设置如下：
@media (min-width: 375px) {}
@media (min-width: 768px) {}
@media (min-width: 992px) {}
@media (min-width: 1280px) {}
一切正常，但在小于375像素的设备上测试时，不考虑规则。我希望你明白我的意思。我查看了 bootstrap 如何进行媒体查询，但我无法确定是否存在任何差异。
创建一个最大宽度为 374px 的媒体查询，然后将您的 css 插入其中。
无论您使用移动优先还是桌面优先方法，您都需要一些适用于 none 媒体查询的样式。在您的示例中，有 no 样式适用于 375 像素以下的宽度。如果您简单地从该查询中取出第一个查询 (<375) 中的 CSS 规则并将其放在样式表的最开头，则很可能没问题。
或者说区别：只需擦掉开头的 @media (min-width: 375px) { 和结束的 } 括号，那么这些样式将适用于所有小于 768px 的宽度（也适用于小于 375px 的宽度）
当设备宽度小于“375”（我的最小断点）时，为什么有些设备不听我的媒体查询。我使用@media (min-width: 375px) { // Rules here }...我知道 "requires" 设备必须至少有“375px”宽，但我不知道是什么这里错了。当我将 375 断点更改为 0px 时它起作用了...但这是否是正确的方法？
在我的 "media.scss" 文件中，我的设置如下：
@media (min-width: 375px) {}
@media (min-width: 768px) {}
@media (min-width: 992px) {}
@media (min-width: 1280px) {}
一切正常，但在小于375像素的设备上测试时，不考虑规则。我希望你明白我的意思。我查看了 bootstrap 如何进行媒体查询，但我无法确定是否存在任何差异。
创建一个最大宽度为 374px 的媒体查询，然后将您的 css 插入其中。
无论您使用移动优先还是桌面优先方法，您都需要一些适用于 none 媒体查询的样式。在您的示例中，有 no 样式适用于 375 像素以下的宽度。如果您简单地从该查询中取出第一个查询 (<375) 中的 CSS 规则并将其放在样式表的最开头，则很可能没问题。
或者说区别：只需擦掉开头的 @media (min-width: 375px) { 和结束的 } 括号，那么这些样式将适用于所有小于 768px 的宽度（也适用于小于 375px 的宽度）