Bootstrap 3 navbar-fixed-top stay固定在手机视图

这可能是一个错误或者只是我的错误编码。我使用twitter bootstrap 2.3。*构建了一个网站，并且发现没有问题，尤其是响应函数。当我试图切换到最新的稳定版本的引导程序3.RC-2时（根据Wikipedia），问题出现了。我也尝试了下载中包含的示例，并且在尝试调整视口大小时也得到了相同的结果。Bootstrap 3 navbar-fixed-top stay固定在手机视图

查看示例中的http://bootply.com/69863，尝试调整窗口浏览器的大小，然后单击渲染视图，然后尝试展开菜单并滚动页面。

我真正的问题是如何在移动（可折叠）视图中使固定导航栏静态？

来源

2013-08-16 cybermujahidz

，它甚至没有在移动设备上，你的代码工作？ –

.navbar-fixed-top让导航栏固定在所有屏幕尺寸的顶部。这将是默认设置。当你看看navbar.less时，你会看到没有媒体查询也适用于这个类。

为了使导航栏静态崩溃后的自举CSS后，如下所示的CSS添加：

@media (max-width: 767px) /* @grid-float-breakpoint -1 */ 
{ 
    .navbar-fixed-top 
    { 
    position: relative; 
    top: auto; 
    } 
}

来源

2013-08-16 09:13:32

此外什么低音Jobsen已经提到的，在手机上更好的可用性，下面的CSS代码段删除“子滚动”导航栏上，并删除上边距是有由于大屏幕导航栏固定：

@media (max-width: 767px) { 
    .navbar-fixed-top { 
     position: relative; 
     top: auto; 
    } 
    .navbar-collapse { 
     max-height: none; 
    } 
    body { 
     margin: 0; 
    } 
}

来源

2013-12-17 15:08:00 DarkScrolls

同样值得考虑的是，重置折叠菜单的最大高度：'.navbar-fixed-top .navbar-collapse {max-height：auto;}' –

-3

@media (max-width: 767px){ 

    .navbar-fixed-top { 
     position: relative; 
     top: auto;/* Auto position navbar top */ 
    } 

    .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse { 
     max-height:inherit;/* Clear max-height */ 
    } 

    body{ 
     padding:0px;/* No padding */ 
    } 
}

来源

2016-06-14 00:29:56 Martha

请添加解释！ –

Bootstrap 3 navbar-fixed-top stay固定在手机视图

回答

相关问题