css 为什么介质查询中的最大宽度不起作用

uujelgoq 于 2023-01-06 发布在其他

关注(0)|答案(2)|浏览(98)

我写了这段代码但它不工作

@media  (max-width: 767px){  

.navbar-brand {     
     padding-top: 10px;     
     height: 80px;  
}  
.navbar-brand h1{   
     padding-top: 10px;     
     font-size: 5vw;  
}  
.navbar-brand p {   
     font-size: .6em;   
     margin-top: 12px;  
}  
.navbar-brand p img {       
     height: 20px ;  
}  

#collapsable-nav a {    
     font-size: 1.2em; 
}  

#collapsable-nav a span{    
     font-size: 1em;  
} 
}

当屏幕小于767px时，我想更改我的navbar，但它根本不起作用。

css

来源：https://stackoverflow.com/questions/74987714/why-max-width-in-media-query-is-not-working

2条答案

按热度按时间

7eumitmz1#

使用最小宽度而不是最大宽度

@media (min-width: 767px) {
      .navbar-brand {
        padding-top: 10px;
        height: 80px;
      }
      .navbar-brand h1{
        padding-top: 10px;
        font-size: 5vw;
      }
      .navbar-brand p {
        font-size: .6em;
        margin-top: 12px;
      }
      .navbar-brand p img {
        height: 20px;
      }
      #collapsable-nav a {
        font-size: 1.2em;
      }
      #collapsable-nav a span{
        font-size: 1em;
      }
    }

访问下面的链接来了解更多关于css中min-widht的内容：https://www.w3schools.com/cssref/playdemo.php?filename=playcss_min-width

赞(0）回复(0）举报 2023-01-06

bvpmtnay2#

在这种情况下，您可能应该使用最小宽度进行媒体查询。请阅读how to ask a proper question并更新您的问题，以便我们更好地为您提供帮助。

赞(0）回复(0）举报 2023-01-06