媒体查询与显示选项一起使用

Question

我已经在CSS类中附加了此媒体查询。

CSS

  @media all and (max-width: 600px) {
    .details{
       display:block;
    }
}

.details{

  margin-left: 20px;
   font-size: 15px; 
    color: black;
}

HTML

 <p class="details" > My career has taken a natural progression fro m client websites, to UI templates, to simple php websites, to Laravel framework. </p>

我的问题是，在媒体查询类中，无论我写什么而不是display都没用。我正在尝试使用其他颜色color:blue，但是颜色保持不变。

问题是什么？

Answer 1

只需更改顺序：

.details{

  margin-left: 20px;
   font-size: 15px; 
    color: black;
} 
@media all and (max-width: 600px) {
    .details{
       display:block;
      color: blue;
    }
}

Answer 2

将媒体查询移至详细信息类的底部。

当您多次为类或ID设置属性时，最后一个会影响该类或ID。