覆盖原有的CSS与媒体查询

Question

我创建了一个文章标题CSS代码，从一个岗位，我要怎么从重叠固定头解决方案，通过改变

#Article_Header2 { 
height: 48px; 
font: normal normal normal normal 16px/normal 'Roboto Condensed', sans-serif; 
margin: 0px; 
} 

到

#Article_Header2 { 
min-height: 48px; 
font: normal normal normal normal 16px/normal 'Roboto Condensed', sans-serif; 
margin: 0px; 
} 

更改到最小高度：48px完美适用于手机，但不适用于桌面。我想将其更改为仅适用于移动设备上。 我可以问我哪里错了。我尝试了下面的内容。

@media (max-width:767px) { 

    body #Article_Header2 { 
     min-height: 48px; 
     font: normal normal normal normal 16px/normal 'Roboto Condensed', sans-serif; 
     margin: 0px; 
    } 
} 

当应用该选项时，最小高度也应用于桌面。我想知道如何设置min-height：48px只能在移动设备上设置高度为48px的其他设置。

Answer 1

由于高度和最小高度是不同的属性，所以不会覆盖另一个属性。

#Article_Header2 { 
font: normal normal normal normal 16px/normal 'Roboto Condensed', sans-serif; 
margin: 0px;  
} 

@media (min-width:768px) { 
#Article_Header2 { 
height: 48px;   
} 
} 

@media (max-width:767px) { 
#Article_Header2 { 
min-height: 48px;  
} 
}