999久久久国产精品-999久久久精品视频在线观看-999久久久免费精品国产牛牛-999久久免费高清热精品-999热成人精品国产免

小編最近在做一個(gè)后臺(tái)系統(tǒng)，大家都知道，系統(tǒng)中會(huì)有很多的數(shù)據(jù)，這樣就會(huì)用到table來布局。那么怎么讓表格在寬度不夠的情況下，自動(dòng)生成滾動(dòng)條呢。有人可能要說用overflow-y：scroll 這可能是一種辦法。但是因?yàn)槭窃鷳B(tài)的，所以會(huì)不太美觀，今天蘇州網(wǎng)站建設(shè)帶大家一起學(xué)習(xí)一下bootstrap中表格的使用。
表格是Bootstrap的一個(gè)基礎(chǔ)組件之一，Bootstrap為表格提供了1種基礎(chǔ)樣式和4種附加樣式以及1個(gè)支持響應(yīng)式的表格。在使用Bootstrap的表格過程中，只需要添加對(duì)應(yīng)的類名就可以得到不同的表格風(fēng)格。
Bootstrap還為表格的行元素提供了五種不同的類名，每種類名控制了行的不同背景顏色
其使用非常的簡單，只需要在元素中添加上表對(duì)應(yīng)的類名
基礎(chǔ)表格 .table
對(duì)表格的結(jié)構(gòu)，跟我們平時(shí)使用表格是一樣的,在Bootstrap基礎(chǔ)表格是通過類名“.table”來控制
斑馬線表格 .table-striped
簡單點(diǎn)說就是讓表格帶有背景條紋效果。在Bootstrap中實(shí)現(xiàn)這種表格效果并不困難，只需要在的基礎(chǔ)上增加類名“.table-striped”即可

帶邊框的表格 .table-bordered

即所有單元格具有一條1px的邊框。只需要在基礎(chǔ)表格 基礎(chǔ)上添加一個(gè)“.table-bordered”類名即可

鼠標(biāo)懸浮高亮的表格 .table-hover

當(dāng)鼠標(biāo)懸停在表格的行上面有一個(gè)高亮的背景色，使用也簡單，僅需要 元素上添加類名“table-hover”即可。

緊湊型表格 .table-condensed

緊湊型表格的運(yùn)用，也只是需要在 基礎(chǔ)上添加類名“table-condensed”
Bootstrap中緊湊型的表格與基礎(chǔ)表格差別不大，因?yàn)橹皇菍卧竦膬?nèi)距由8px調(diào)至5px。

響應(yīng)式表格 .table-responsive

Bootstrap提供了一個(gè)容器，并且此容器設(shè)置類名“.table-responsive”,此容器就具有響應(yīng)式效果，然后將 置于這個(gè)容器當(dāng)中，這樣表格也就具有響應(yīng)式效果。
Bootstrap中響應(yīng)式表格效果表現(xiàn)為：當(dāng)你的瀏覽器可視區(qū)域小于768px時(shí)，表格底部會(huì)出現(xiàn)水平滾動(dòng)條。當(dāng)你的瀏覽器可視區(qū)域大于768px時(shí)，表格底部水平滾動(dòng)條就會(huì)消失。
這是蘇州網(wǎng)絡(luò)公司小編在做系統(tǒng)中遇到問題整理的一些關(guān)于bootstrap的表格用法，但是不管制作哪種表格都離不開類名“table”。所以大家在使用Bootstrap表格時(shí)，千萬注意你的 元素中一定不能缺少類名“table”。