Javascript CSS媒体查询更正

我已经这样构造了我的断点，我需要1024个断点。我已经最大宽度1199得到冲突可以有人帮我解决这个问题

//断点//------------------------------

/* Landscape phones and portrait tablets */

@mixin bp-xsmall-only {
  @media only screen and (max-width: 480px) {
    @content;
  }
}

@mixin bp-small-and-below {
  @media only screen and (max-width: 767px) {
    @content;
  }
}

/* Portrait tablets and small desktops */

@mixin bp-medium-only {
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    @content;
  }
}

/* Landscape tablets and medium desktops */

@mixin bp-large-only {
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    @content;
  }
}

/* Large desktops and laptops */

@mixin bp-large-and-above {
  @media only screen and (min-width: 992px) {
    @content;
  }
}

@mixin bp-xlarge-only {
  @media only screen and (min-width: 1200px) {
    @content;
  }
}

---

只能使用

最小宽度

或

最大宽度

媒体查询。我建议只使用

minwidth

，因为这是保持样式和断点干净并避免此类错误的简单方法issues@BradyEdgar但是如何最大我的目标最大宽度，我的要求是移动，平板电脑，桌面，给定的视觉轮廓是。480px，1024px，更多。。你能编辑我上面的代码吗？@Durgesh要点是，通过只使用最大宽度或最小宽度，你可以利用CSS的层叠功能（顺便说一句，它代表层叠样式表）有效地确定任何屏幕大小。这是一个问答网站，不是一个代码编写服务。