@media 查询仅适用于该宽度答案

【问题标题】：@media query only work on that width only@media 查询仅适用于该宽度
【发布时间】：2019-04-30 05:58:18
【问题描述】：

我为 768 像素的响应编写 css，但该设计仅显示 768，仅比我的样式折叠的宽度小

@media only screen and (max-width: 768px) {
  .logo {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    text-align: center;
    padding-bottom: 10px;
  }

  .header-middle-box .col-md-3 {
    flex: 0 0 33%;
    max-width: 33%;
  }
}

@media only screen and (max-width: 555px) {
  .header-middle-box .col-md-3 {
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center;
  }
}

【问题讨论】：

那么，你的问题是什么？
在这里了解`@media only screen and (max-height:..)`:unmatchedstyle.com/news/height-based-media-queries.php
我对 768 的媒体查询仅适用于小于 768 的 768px，例如 767,765，直到 555 未应用该样式，我需要应用样式 768px unitl 556
@Riyas Ahamed - 你试过媒体 (max-width:768px) 和 (min-width:556px) 吗？
是但不工作

标签： css twitter-bootstrap media-queries media responsive

【解决方案1】：

问题解决了

我只需为该特定宽度添加单独的媒体查询 @media only screen and (min-width: 556px) and (max-width: 768px) {}

并为该宽度编写自定义 css :) 谢谢您的回复

-瑞亚斯

【讨论】：