小编sam*_*coh的帖子

我和我的团队领导就媒体查询的使用发生了一些争执。关于使用媒体查询有两种方法（据我所知）。

方法一：

@media only screen and (max-width: 600px) {
  .container {
    width: 100%;
  }
}

@media only screen and (min-width: 600px) {
  .container {
    width: 90%;
  }
}

@media only screen and (min-width: 768px) {
  .container {
    width: 80%;
  }
}

方法二：

.container {
  @media only screen and (max-width: 600px) {
    width: 100%;
  }

  @media only screen and (min-width: 600px) {
    width: 90%;
  }

  @media only screen and (min-width: 768px) {
    width: 80%;
  }
}

我是一名初级开发人员，我发现第二种方法更容易使用和理解。但是我的老板告诉我使用第一种方法。老实说，我到处寻找使用我喜欢的第二种方法的示例项目，但找不到！

所以我的问题是为什么？

在我看来，如果我想在这个例子中添加一些类来包装容器，在方法 1 中我需要在每个断点中添加它，而在方法 …