實際運用當中，總會碰到垂直顯示的效果。在bootstrap框架中也提供了這樣的風格。我們只需要把水平分組的「btn-group」類名換成「btn-group-vertical」即可。
<div
class
="btn-group-vertical"
>
<
button
class
="btn btn-default"
type
="button"
>首頁
button
>
<
button
class
="btn btn-default"
type
="button"
>產品展示
button
>
<
button
class
="btn btn-default"
type
="button"
>案例分析
button
>
<
button
class
="btn btn-default"
type
="button"
button
>
<
div
class
="btn-group"
>
<
button
class
="btn btn-default dropdown-toggle"
data-toggle
="dropdown"
type
="button"
span
class
="caret"
>
span
>
button
>
<
ul class
="dropdown-menu"
>
<
li><
a href
="##"
>公司簡介
a>
li>
<
li><
a href
="##"
>企業文化
a>
li>
<
li><
a href
="##"
>組織結構
a>
li>
<
li><
a href
="##"
>客服服務
a>
li>
ul>
div>
div>
<
div
class
="btn-group-vertical"
>
<
button
class
="btn btn-default"
>首頁
button
>
<
button
class
="btn btn-default"
>公司介紹
button
>
<
div
class
="btn-group"
>
<
button
class
="btn btn-default"
data-toggle
="dropdown"
span
class
="caret"
>
span
>
button
>
<
ul class
="dropdown-menu"
>
<
li><
a href
="#"
>蔬菜
a>
li>
<
li><
a href
="#"
>蔬菜
a>
li>
<
li><
a href
="#"
>蔬菜
a>
li>
ul>
div>
div>
Bootstrap系列 29 按鈕組
單個按鈕在web頁面中的運用有時候並不能滿足我們的業務需求，常常會看到將多個按鈕組合在一起使用，比如富文字編輯器裡的一組小圖示按鈕等 按鈕組和下拉列表元件一樣，需要依賴於button.js外掛程式才能正常執行。不過我們同樣可以直接只呼叫bootstrap.js檔案。因為這個檔案已整合了button....
Bootstrap系列 33 等分按鈕
等分按鈕也常被稱為是自適應分組按鈕，其實現方法也非常的簡單，只需要在按鈕組 btn group 上追加乙個 btn group justified 類名.div class btn wrap div class btn group btn group justified a class btn bt...
Bootstrap筆記 按鈕
確定要刪除嗎？修改內容 修改內容 修改內容 修改內容 btn 是按鈕樣式的基類，在新增其他樣式前，必須先新增btn btn primary btn default btn success btn warning btn danger active 啟用 設定按鈕大小 btn lg btn md bt...