Bootstrap Table Classes - Bootstrap Tutorial 16

Publicado em: 05 Dezembro 2019
no canal de: 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

Nesta página do site você pode assistir ao vídeo on-line Bootstrap Table Classes - Bootstrap Tutorial 16 duração hora minuto segundo em boa qualidade , que foi baixado pelo usuário ChidresTechTutorials 05 Dezembro 2019, compartilhe o link com seus amigos e conhecidos, no youtube este vídeo já foi visto 923 vezes e gostou 23 espectadores. Boa visualização!

6,505

317