Documenta et exempla pro opt-in stylis tabularum (praevalentibus usu in JavaScript plugins datis) apud Bootstrap.
Exempla
Ob diffusum usum tabularum transversae tertiae factionis contenta quasi calendaria et dies fraudatores, tabulas nostras destinavimus ut -in optet . Modo basim cuivis classi adiiciam .table, <table>deinde stylos consuetos vel varias inclusas modificantes classes extende.
Mensa principalissima markup utens, hic est quomodo .tabletabulae fundatae in Bootstrap spectant. Omnes styli mensae in Bootstrap hereditantur 4 , significantes quaslibet tabulas nestas eodem modo quo parens vocabitur .
Adde .table-borderedlimites undique mensae et cellae.
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Avis Larry
@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>
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Avis Larry
@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>
Borderless mensam
Adde .table-borderlesspro mensa sine finibus.
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Avis Larry
@twitter
<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>
.table-borderlessadhiberi potest etiam in tabulis obscuris.
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Avis Larry
@twitter
<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>
Hoverable ordines
Adde .table-hoverut status tabernus tabulae intra a <tbody>.
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Avis Larry
@twitter
<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>
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Avis Larry
@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>
Parva mensa
Adde .table-smut tabulas magis compactas secando cellam dimidii.
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Avis Larry
@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>
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Avis Larry
@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>
Contextual classes
Classes contextuales utere ad ordines tabulas colorandas vel singulas cellulas.
Classis
Venantius Fortunatus
Venantius Fortunatus
Active
Cellula
Cellula
Default
Cellula
Cellula
Primarium
Cellula
Cellula
secundarium
Cellula
Cellula
Success
Cellula
Cellula
Periculum
Cellula
Cellula
Monitum
Cellula
Cellula
Info
Cellula
Cellula
lux
Cellula
Cellula
Dark
Cellula
Cellula
<!-- 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>
Tabulae variantes ordinariae cum mensa obscura praesto non sunt, tamen textu vel curriculo utilitates ad similes stilos assequendas uti licet.
#
Venantius Fortunatus
Venantius Fortunatus
1
Cellula
Cellula
2
Cellula
Cellula
3
Cellula
Cellula
4
Cellula
Cellula
5
Cellula
Cellula
6
Cellula
Cellula
7
Cellula
Cellula
8
Cellula
Cellula
9
Cellula
Cellula
<!-- 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>
Deferre significatio technologiae adiuvandae
Color usus ad significationem addere tantum praebet indicationem visualem, quae utentibus technologiarum adiuvantium - sicut lectorum tegumentum. Ut informationes colore notatae sint vel ex ipso contento perspicuae (exempli gratia textus visibilis), vel per medium includi alterum, sicut textus additus occultus cum .sr-onlygenere.
Facere tabulas responsivas cum quibuslibet involucris .table, .table-responsive{-sm|-md|-lg|-xl}faciens tabulam in latitudine ad librum cuiusque max-widthconfractionis usque ad (sed non comprehendo) 576px, 768px, 992px, et 1120px, respective.
Munera <caption>sicut petere mensam. Utentes adiuvat legentibus in screen ut mensam inveniat et quid suus 'intelligat' et si eam legere voluerint, decernunt.
Index users
#
Primis
Last
Capulus
1
Mark
Otto
@mdo
2
Iacobus
Thornton
@fat
3
Larry
Avis
@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>
Responsivum tabulae
Mensae responsales permittunt tabulas facile transversas in volumine. Fac quamlibet mensam responsivam per omnes prospectus per involutionem .tablecum .table-responsive. Vel elige punctum maximum quo ad mensam responsivam habere utendo .table-responsive{-sm|-md|-lg|-xl}.
Vertical clipping / truncation
Mensae responsoriae utuntur overflow-y: hidden, quae res aliquas rescindunt quae super imum vel summum tabulae margines excedunt. Praesertim hoc menus dropdown et aliae tertiae factionis contenta circumplecti possunt.
Semper responsive
Per omne punctum, utere .table-responsivead tabulas horizontaliter scrolling.
Utere .table-responsive{-sm|-md|-lg|-xl}ut opus est ad mensas responsivas creandas usque ad punctum particulare fracturae. Ab illo puncto et sursum, mensa regulariter se geret et non horizontaliter librum.
Hae tabulae fractae videri possunt donec styli responsivas eorum in latitudines certas prospectus applicant.