Bootstrap 列表

Bootstrap提供了6種形式的列表,分別是:普通列表有序列表去點列表


內聯列表描述列表水平描述列表


(1).普通列表:


普通列表的使用方式和平時的用法一致,只有一點細微的差別:列表的margin-top爲0


(2).有序列表:


有序列表也是做了一些微調,看起來比原來默認的顯示柔和了一些。


(3).去點列表:


去除列表項前的小圓點可以使用list-unstyled樣式。用法舉例爲:<ul class="list-unstyled"></ul>


注意:去除圓點只是去除了當前元素節點下的 li 旁邊的圓點,如果 li 元素裏面還有嵌套的


ul或者ol,將不會對嵌套的起任何作用


(4).內聯列表:


Bootstrap定義了一個內聯列表list-inline,也就是將列表項水平顯示。其應用舉例如下:


代碼1:

<ul class="list-inline">
<li>國內</li><li>國際</li><li>體育</li><li>娛樂</li>
</ul>


其顯示效果如下圖1:


圖1


(5).定義列表:


bootstrap對默認的dl定義列表進行了一些細微的調整,主要調整行間距字體加粗


(6).水平定義列表:


bootstrap提供了一個dl-horizontal樣式,通過在dl元素上應用該class,實現了列表水平


顯示的效果。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章