Барои .table-borderedсарҳадҳо дар ҳама паҳлӯҳои ҷадвал ва чашмакҳо илова кунед.
#
Аввал
Охирин
Дастак кардан
1
Марк
Отто
@mdo
2
Яъқуб
Торнтон
@фарбеҳ
3
Ларри парранда
@twitter
<tableclass="table table-bordered"><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><tdcolspan="2">Larry the Bird</td><td>@twitter</td></tr></tbody></table>
#
Аввал
Охирин
Дастак кардан
1
Марк
Отто
@mdo
2
Яъқуб
Торнтон
@фарбеҳ
3
Ларри парранда
@twitter
<tableclass="table table-bordered table-dark"><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><tdcolspan="2">Larry the Bird</td><td>@twitter</td></tr></tbody></table>
<tableclass="table table-borderless"><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><tdcolspan="2">Larry the Bird</td><td>@twitter</td></tr></tbody></table>
<tableclass="table table-borderless table-dark"><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><tdcolspan="2">Larry the Bird</td><td>@twitter</td></tr></tbody></table>
<tableclass="table table-hover"><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><tdcolspan="2">Larry the Bird</td><td>@twitter</td></tr></tbody></table>
#
Аввал
Охирин
Дастак кардан
1
Марк
Отто
@mdo
2
Яъқуб
Торнтон
@фарбеҳ
3
Ларри парранда
@twitter
<tableclass="table table-hover table-dark"><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><tdcolspan="2">Larry the Bird</td><td>@twitter</td></tr></tbody></table>
Мизи хурд
Илова кунед .table-sm, то ҷадвалҳоро паймонтар созед, бо буридани қабати ҳуҷайраҳо дар нимсолаи худ.
#
Аввал
Охирин
Дастак кардан
1
Марк
Отто
@mdo
2
Яъқуб
Торнтон
@фарбеҳ
3
Ларри парранда
@twitter
<tableclass="table table-sm"><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><tdcolspan="2">Larry the Bird</td><td>@twitter</td></tr></tbody></table>
#
Аввал
Охирин
Дастак кардан
1
Марк
Отто
@mdo
2
Яъқуб
Торнтон
@фарбеҳ
3
Ларри парранда
@twitter
<tableclass="table table-sm table-dark"><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><tdcolspan="2">Larry the Bird</td><td>@twitter</td></tr></tbody></table>
Синфҳои контекстӣ
Барои ранг кардани сатрҳои ҷадвал ё чашмакҳои алоҳида аз синфҳои контекстӣ истифода баред.
Синф
Сарлавҳа
Сарлавҳа
Фаъол
Ҳуҷайра
Ҳуҷайра
Пешфарз
Ҳуҷайра
Ҳуҷайра
ибтидоӣ
Ҳуҷайра
Ҳуҷайра
Миёна
Ҳуҷайра
Ҳуҷайра
Муваффакият
Ҳуҷайра
Ҳуҷайра
Хатар
Ҳуҷайра
Ҳуҷайра
Огоҳӣ
Ҳуҷайра
Ҳуҷайра
Маълумот
Ҳуҷайра
Ҳуҷайра
Нур
Ҳуҷайра
Ҳуҷайра
Торик
Ҳуҷайра
Ҳуҷайра
<!-- On rows --><trclass="table-active">...</tr><trclass="table-primary">...</tr><trclass="table-secondary">...</tr><trclass="table-success">...</tr><trclass="table-danger">...</tr><trclass="table-warning">...</tr><trclass="table-info">...</tr><trclass="table-light">...</tr><trclass="table-dark">...</tr><!-- On cells (`td` or `th`) --><tr><tdclass="table-active">...</td><tdclass="table-primary">...</td><tdclass="table-secondary">...</td><tdclass="table-success">...</td><tdclass="table-danger">...</td><tdclass="table-warning">...</td><tdclass="table-info">...</td><tdclass="table-light">...</td><tdclass="table-dark">...</td></tr>
<!-- On rows --><trclass="bg-primary">...</tr><trclass="bg-success">...</tr><trclass="bg-warning">...</tr><trclass="bg-danger">...</tr><trclass="bg-info">...</tr><!-- On cells (`td` or `th`) --><tr><tdclass="bg-primary">...</td><tdclass="bg-success">...</td><tdclass="bg-warning">...</td><tdclass="bg-danger">...</td><tdclass="bg-info">...</td></tr>
Ҷадвалҳои ҷавобгӯро тавассути печонидани ҳама .tableбо .table-responsive{-sm|-md|-lg|-xl}, созед, ки ҷадвалро дар ҳар як max-widthнуқтаи кандашавӣ то (вале аз он ҷумла) мутаносибан то 576px, 768px, 992px ва 1120px ҳаракат кунад.
Дар хотир доред, ки азбаски браузерҳо дар айни замон
дархостҳои контексти диапазониро дастгирӣ намекунанд , мо дар атрофи маҳдудиятҳо
min-ва max-префиксҳо ва намоишгоҳҳои паҳнои касрӣ (масалан, дар шароити муайян дар дастгоҳҳои баланд-dpi рух дода метавонад) бо истифода аз арзишҳо бо дақиқии баландтар барои ин муқоисаҳо кор мекунем. .
Сарлавҳаҳо
Функсия <caption>мисли сарлавҳаи ҷадвал. Он ба корбарони дорои экрани хонандагон кӯмак мекунад, ки ҷадвалро пайдо кунанд ва фаҳманд, ки он дар бораи чӣ аст ва қарор кунад, ки оё онҳо онро хондан мехоҳанд.
Рӯйхати истифодабарандагон
#
Аввал
Охирин
Дастак кардан
1
Марк
Отто
@mdo
2
Яъқуб
Торнтон
@фарбеҳ
3
Ларри
парранда
@twitter
<tableclass="table"><caption>List of users</caption><thead><tr><thscope="col">#</th><thscope="col">First</th><thscope="col">Last</th><thscope="col">Handle</th></tr></thead><tbody><tr><thscope="row">1</th><td>Mark</td><td>Otto</td><td>@mdo</td></tr><tr><thscope="row">2</th><td>Jacob</td><td>Thornton</td><td>@fat</td></tr><tr><thscope="row">3</th><td>Larry</td><td>the Bird</td><td>@twitter</td></tr></tbody></table>
Ҷадвалҳои ҷавобӣ
Ҷадвалҳои ҷавобӣ имкон медиҳанд, ки ҷадвалҳо ба осонӣ ба таври уфуқӣ ҳаракат кунанд. Ҳар як ҷадвалро бо печонидани як .tableбо .table-responsive. Ё, нуқтаи ҳадди аксарро интихоб кунед, ки бо он ҷадвали ҷавобгӯ то бо истифода аз .table-responsive{-sm|-md|-lg|-xl}.