bootstrap3柵格怎么畫(huà)5列
bootstrap3柵格怎么畫(huà)5列
三國(guó)紛爭(zhēng)
2018-10-29 00:00:09
TA貢獻(xiàn)1851條經(jīng)驗(yàn) 獲得超4個(gè)贊
bootstrap里面沒(méi)有設(shè)定5列的,他是把一行分成12個(gè)等分的柵格,然后col-xs-1就是1個(gè)柵格單位,所以寬度就是1/12。col-xs-3就是3個(gè)柵格單位,寬度就是3/12=25%,每行能放4個(gè),剛好100%。根據(jù)這個(gè)原理,想分成5列也很好辦,可以直接用col-xs-3,然后在CSS里加一行代碼
.col-xs-3 { width:20%;} 等于重新定義了柵格寬度,這樣每行剛好5個(gè)。
提示下:這樣定義的話,整個(gè)頁(yè)面的.col-xs-3都是20%的寬度了,而不是bs默認(rèn)定義的25%。
所以最好辦法是在每列的DIV上再加一個(gè)class,定義這個(gè)class的寬度為20%,完美解決。
舉報(bào)