Twitter Bootstrap 3 - 将 CSS Only 应用于 -md（中等）屏幕尺寸的正确方法？

Question

据我了解，Twitter Bootstrap 3 认为任何 -md 都是最小宽度为 992px 的屏幕尺寸，根据这篇文章：Twitter Bootstrap 3: how to use media queries?

现在我想要做的是，当且仅当屏幕尺寸为中等时，我想应用 CSS，仅此而已。我尝试的是

@media(max-width:767px){
}

@media(min-width:768px){
}

@media(min-width:992px){
    .margin-bottom-image-md { margin-bottom: 15%; }
}

@media(min-width:1200px){
}

但这也会影响大屏幕。那么我所做的是：

@media(max-width:767px){
}

@media(min-width:768px){
}

@media(min-width:992px) and (max-width:1199px){
    .margin-bottom-image-md { margin-bottom: 15%; }
}

@media(min-width:1200px){
}

它有效，但我只是想知道这是否是唯一的方法，或者是否还有另一种更推荐的方法（也许 Bootstrap 有它自己的处理方式，我不知道）？

Answer 1

除非您使用 SASS 或 LESS（您可以使用变量或您的方式），否则您定义的方式是正确的。 and 运算符将检查这两个条件。