我正在根据引导网格系统大小为不同的屏幕尺寸做一些不同的样式。由于某些原因，一些样式是有效的，有些则不是。这是css：
2016-07-05
2016-07-06
...
2016-08-04
2016-08-05
主要是@media only screen
and (max-width: 767px) {
div.bm {
display: none;
}
div.br {
height: 40%;
}
div.main-row {
height: 60%;
}
#main-text{
font-size: 3rem;
font-weight: 300;
}
}
@media only screen
and (max-width:991px)
and (min-width:767px) {
div.sm {
display: none;
}
div.main-row {
height: 100%;
}
#main-text{
font-size: 4.5rem;
font-weight: 300;
}
}
@media only screen
and (min-width:991px)
and (max-width:1999px) {
div.sm {
display: none;
}
div.main-row {
height: 100%;
}
#main-text {
font-size: 5.5rem;
font-weight: 300;
}
}
@media only screen
and (min-width: 1200px) {
div.sm {
display: none;
}
div.main-row {
height: 100%;
}
#main-text {
font-size: 6.5rem;
font-weight: 300;
}
}
没有生效，但似乎display:none正在调整大小。我觉得这行有一个语法错误：
#main-text
因为我正在使用css预处理器手写笔，并且它导致围绕该行代码出现此错误：
@media only screen
and (min-width:991px)
and (max-width:1999px) {代码有什么问题？
答案 0 :(得分：1)
一个问题是：
第一个：
@media only screen
and (min-width:991px)
and (max-width:1999px)
这里的像素宽度段是[991; 1999];
第二个：
@media only screen
and (min-width: 1200px)
这里的像素宽度段是[1200; +无穷]
如果你看看这两个像素宽度数组：两个媒体查询中都包含一些元素：[1200; 1999年]。
这会导致错误，因为当两个条件都为真时，它们都不能同时运行。
检查这样的其他问题。