Bootstrap Table Classes - Bootstrap Tutorial 16

Опубликовано: 05 Декабрь 2019
на канале: 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

На этой странице сайта вы можете посмотреть видео онлайн Bootstrap Table Classes - Bootstrap Tutorial 16 длительностью часов минут секунд в хорошем качестве, которое загрузил пользователь ChidresTechTutorials 05 Декабрь 2019, поделитесь ссылкой с друзьями и знакомыми, на youtube это видео уже посмотрели 923 раз и оно понравилось 23 зрителям. Приятного просмотра!