bootstrap官網的組件有哪些

這篇文章主要介紹了bootstrap官網的組件有哪些，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

Bootstrap中包含了豐富的Web組件，根據這些組件，可以快速的搭建一個漂亮、功能完備的網站。其中包括以下組件：

下拉菜單、按鈕組、按鈕下拉菜單、導航、導航條、路徑導航、分頁、排版、縮略圖、警告對話框、進度條、媒體對象等。

在此對其中一些組件，進行演示。

下拉菜單（Dropdowns）

下拉菜單是可切換的，是以列表格式顯示鏈接的上下文菜單。這可以通過與 下拉菜單（Dropdown） JavaScript 插件 的互動來實現。

如需使用下拉菜單，只需要在 class .dropdown 內加上下拉菜單即可。下面的實例演示了基本的下拉菜單：

<div class="dropdown">    <button type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">主題        <span class="caret"></span>    </button>    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">        <li role="presentation">            <a role="menuitem" tabindex="-1" href="#">Java</a>        </li>        <li role="presentation">            <a role="menuitem" tabindex="-1" href="#">數據挖掘</a>        </li>        <li role="presentation">            <a role="menuitem" tabindex="-1" href="#">數據通信/網絡</a>        </li>        <li role="presentation" class="divider"></li>        <li role="presentation">            <a role="menuitem" tabindex="-1" href="#">分離的鏈接</a>        </li>    </ul></div>

導航

它們使用相同的標記和基類 .nav。Bootstrap 也提供了一個用于共享標記和狀態的幫助器類。改變修飾的 class，可以在不同的樣式間進行切換。

<p>標簽式的導航菜單</p><ul class="nav nav-tabs">  <li class="active"><a href="#">Home</a></li>  <li><a href="#">SVN</a></li>  <li><a href="#">iOS</a></li>  <li><a href="#">VB.Net</a></li>  <li><a href="#">Java</a></li>  <li><a href="#">PHP</a></li></ul>

感謝你能夠認真閱讀完這篇文章，希望小編分享的“bootstrap官網的組件有哪些”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，更多相關知識等著你來學習!