如何通過Bootstrap有一個正常的酒吧？（不是導航）

我想對我的網站，它不是一個導航欄的頂部的一欄。各種項目將在這個酒吧。所以我在想如何使用Bootstrap來達到這個目的。 Bootstrap中有一個導航欄，但我已經用它來導航我的酒吧。我也可以將它用於不同的目的嗎？如何通過Bootstrap有一個正常的酒吧？（不是導航）

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
    <div class="container-fluid"> 
    </div> 
</nav>

來源

2014-08-27 Dan

使用navbar-static-top而不是navbar-fixed-top爲你引導的導航條。

你引導的導航欄前添加<div id="normal-bar">My normal bar</div>，你可以定製你想要的任何方式。

引導的入門模板 - DEMO

HTML

<div id="normal-bar">My normal bar</div> 
<div class="navbar navbar-inverse navbar-static-top"> 
...... 
</div>

CSS

body { 
    padding-top: 0px; /* It was 50px before */ 
} 
#normal-bar { 
    /* Your CSS - It's only for DEMO */ 
    background-color:#f00; 
    text-align:center; 
    padding:10px 0px; 
    font-size:20px; 
}

來源

2014-08-27 17:57:20 Anonymous

謝謝。好想法！ – Dan 2014-08-27 21:29:02

我很高興能幫上忙。 :) – Anonymous 2014-08-27 21:30:39

您不需要使用nav。有關其他棒材和型材使用此代碼：

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-md-12"> 
      <p>Some text here or whatever you want</p> 
     </div> 
    </div> 
</div>

你nav有position:fixed和min-height:50px性質，所以不要忘記添加到您的下一個部分margin-top:50px所以它是可見的。

來源

2014-08-27 17:14:53 Kamil

沒有必要使用'導航欄，固定top' – Anonymous 2014-08-27 17:17:29

是，但他做到了。 – Kamil 2014-08-27 17:18:18

非常感謝，它不是我想要的100％，而是非常有幫助。 – Dan 2014-08-27 21:26:30

是的，您可以使用兩個導航欄來實現此行爲，方法是使用兩個單獨的導航欄，分別爲navbar-fixed-top和navbar-static-top。在bootply上查看this example。

來源

2014-08-27 17:29:29

如何通過Bootstrap有一個正常的酒吧？ （不是導航）

回答

相關問題

如何通過Bootstrap有一個正常的酒吧？（不是導航）