在移动浏览器中隐藏导航栏 [英] Hide navbar in mobile browsers

问题描述

我正在使用 Twitter Bootstrap 制作一个移动响应式网站.当在移动设备上查看网站时，我想完全隐藏顶部导航栏.有人知道这样做的方法吗?

解决方案

最简单的方法是使用响应式实用程序类 .hidden-phone 和 .hidden-tablet

您还可以使用媒体查询，例如..

@media (max-width: 767px) {.导航栏{显示:无；}}

更多关于响应式类的信息:http://twitter.github.io/bootstrap/scaffolding.html#responsive

演示

I'm making a mobile responsive site using Twitter Bootstrap. I'd like to completely hide the top navbar when the site is viewed on mobile. Anyone know a way to do this?

解决方案

The easiest way is to use the responsive utility classes .hidden-phone and .hidden-tablet

<div class="navbar hidden-tablet hidden-phone">

You could also use a media query such as..

@media (max-width: 767px) { 
    .navbar{
        display:none;
    }
}

More on responsive classes here: http://twitter.github.io/bootstrap/scaffolding.html#responsive

Demo

这篇关于在移动浏览器中隐藏导航栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！