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固定在手機視圖

回答

相關問題