html - 最大宽度媒体查询采用错误的宽度

Question

所以我有一个 queries.css 当前接受

@media only screen and (max-width: 1140px){
  .row,
  .hero-img{
    width: 100%;
  }
}

@media only screen and (max-width: 930px){
  /* code */ 
}

但是当浏览器(chrome)的宽度为 1023 时，它会注册 max-width:930px 媒体查询的代码。

有谁知道这里的问题是什么。我看到了其他相关的帖子，他们说要使用 min-width 和 meta 标签，我都做了，但仍然会导致同样的问题。

此外，当我尝试将代码写入 1140px 最大宽度媒体查询时，930px 的媒体查询会覆盖该媒体查询。

Answer 1

试试这个

@media only screen and (max-width: 100%){
  .row,
  .hero-img{
    width: 100%;
  }
}

@media only screen and (max-width: 100%){
  /* code */ 
}