Question

在我的网站上，我有如下菜单导航：

   <nav id="main-menu" class="menu-wrapper col-md-12 collapse navbar-collapse mynavbar">
    <ul id="mn_menu" class="menu nav navbar-nav">
        <li><a href="<?=site_url()?>">Home</a></li>
        <li><a href="<?=site_url()?>section/about-us">About Us</i></a></li>
        <li><a href="<?=site_url()?>section/services">Services</a></li>
        <li><a href="<?=site_url()?>section/contact-us">Contact Us</a></li>
     </ul>
   </nav>

在大屏幕上我想要隐藏这个菜单。所以当我在我的CSS文件中写下以下内容时它不会隐藏菜单

 @media screen and (max-width: 992px) {
   #mn_menu {
     display: none;
   }
}

但是，当我使用下面给出的内联css时，它会隐藏菜单

<ul id="mn_menu" class="menu nav navbar-nav" style="display:none;">

请告知如何使用媒体查询从CSS文件中隐藏我的菜单。提前谢谢。

Answer 1

您需要max-width而不是min-width。 992px表示只要浏览器宽度高于或等于@media screen and (min-width: 992px) { #mn_menu { display: none; } }，它就会应用下面的CSS规则。

library(rworldmap)
library(rgeos)
library(maps)

data("countriesCoarseLessIslands")
data("coastsCoarse")

country <- "Argentina"

countryOutline <- countriesCoarseLessIslands[countriesCoarseLessIslands$NAME %in% country,]
maps::map(countryOutline,col="light grey",fill=TRUE,border=0)
coastalBorder <- gIntersection(coastsCoarse,countryOutline)
plot(coastalBorder, col="blue",lwd=2,add=TRUE)

使用媒体查询隐藏主菜单

1 个答案: