Bootstrap Table Classes - Bootstrap Tutorial 16

Pubblicato il: 05 dicembre 2019
sul canale di: ChidresTechTutorials

923

Notes for You:: Bootstrap Table Classes - Bootstrap Tutorial 16

table: sets table width to 100% and ads top border to table rows
<table class="table">
<thead>
<tr>
<th>Some Text</th><th>Some Text</th>
</tr>
</thead>
<tbody>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tfoot>
</table>

table & table-striped : sets alternative background color to the rows of a table body tag
<table class="table table-striped">
<thead>
<tr>
<th>Some Text</th><th>Some Text</th>
</tr>
</thead>
<tbody>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tfoot>
</table>

table & table-bordered: creates a table with border
<table class="table table-bordered">
<thead>
<tr>
<th>Some Text</th><th>Some Text</th>
</tr>
</thead>
<tbody>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tfoot>
</table>

table & table-borderless : creates a table without border
<table class="table table-borderless">
<thead>
<tr>
<th>Some Text</th><th>Some Text</th>
</tr>
</thead>
<tbody>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tfoot>
</table>

table & table-hover : it ads hover effect to rows of a table body tag
<table class="table table-hover">
<thead>
<tr>
<th>Some Text</th><th>Some Text</th>
</tr>
</thead>
<tbody>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tfoot>
</table>

Table Color related classes:
allow us to create colored tables

table-primary
table-secondary
table-success
table-info
table-warning
table-danger
table-light
table-dark

<table class="table table-primary table-hover">
<thead>
<tr>
<th>Some Text</th><th>Some Text</th>
</tr>
</thead>
<tbody>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Some Text</td><td>Some Text</td>
</tr>
</tfoot>
</table>

Note:
replace < with less-than symbol.
replace > with greater-than symbol.

=========================================

Follow the link for next video:
Bootstrap Tutorial 17 - Bootstrap Button Related Classes | Bootstrap Buttons
   • Bootstrap Button Classes - Bootstrap Tutor...

Follow the link for previous video:
Bootstrap Tutorial 15 - Bootstrap List Related Classes | Bootstrap Lists
   • Bootstrap List Classes - Bootstrap Tutoria...

=========================================

Bootstrap Tutorials Playlist:-
   • Bootstrap4 Tutorials

=========================================
Watch My Other Useful Tutorials:-

PHP Tutorials Playlist:-
   • PHP Tutorials - The Ultimate Course

=========================================

Subscribe to our YouTube channel:-
   / chidrestechtutorials

Hash Tags:- #ChidresTechTutorials #Bootstrap #BootstrapTutorial

In questa pagina del sito puoi guardare il video online Bootstrap Table Classes - Bootstrap Tutorial 16 della durata di ore minuti seconda in buona qualità , che l'utente ha caricato ChidresTechTutorials 05 dicembre 2019, condividi il link con amici e conoscenti, su youtube questo video è già stato visto 923 volte e gli è piaciuto 23 spettatori. Buona visione!