Загрузка...
Перейти к содержимому
 
En
Вход

Таблицы

Для оформления таблиц предусмотрены следующие стили:

Класс HTML Внешний вид
-

<table>
<thead>
<tr>
<th>Заголовок 1</th>
<th>Заголовок 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Название11</td>
<td>Название12</td>
</tr>
<tr>
<td>Название21</td>
<td>Название22</td>
</tr>
<tr>
<td>Название31</td>
<td>Название32</td>
</tr>
</tbody>
</table>
Заголовок 1 Заголовок 2
Название11 Название12
Название21 Название22
Название31 Название32
table

<table class="table">
<thead>
<tr>
<th>Заголовок 1</th>
<th>Заголовок 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Название11</td>
<td>Название12</td>
</tr>
<tr>
<td>Название21</td>
<td>Название22</td>
</tr>
<tr>
<td>Название31</td>
<td>Название32</td>
</tr>
</tbody>
</table>
Заголовок 1 Заголовок 2
Название11 Название12
Название21 Название22
Название31 Название32
table table-striped

<table class="table table-striped">
<thead>
<tr>
<th>Заголовок 1</th>
<th>Заголовок 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Название11</td>
<td>Название12</td>
</tr>
<tr>
<td>Название21</td>
<<td>Название22</td>
</tr>
<tr>
<td>Название31</td>
<td>Название32</td>
</tr>
</tbody>
</table>

Заголовок 1 Заголовок 2
Название11 Название12
Название21 Название22
Название31 Название32
table table-bordered

<table class="table table-bordered">
<thead>
<tr>
<th>Заголовок 1</th>
<th>Заголовок 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Название11</td>
<td>Название12</td>
</tr>
<tr>
<td>Название21</td>
<td>Название22</td>
</tr>
<tr>
<td>Название31</td>
<td>Название32</td>
</tr>
</tbody>
</table>
Заголовок 1 Заголовок 2
Название11 Название12
Название21 Название22
Название31 Название32
table table-hover

<table class="table table-hover">
<thead>
<tr>
<th>Заголовок 1</th>
<th>Заголовок 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Название11</td>
<td>Название12</td>
</tr>
<tr>
<td>Название21</td>
<td>Название22</td>
</tr>
<tr>
<td>Название31</td>
<td>Название32</td>
</tr>
</tbody>
</table>

Заголовок 1 Заголовок 2
Название11 Название12
Название21 Название22
Название31 Название32

(выделяет строку при наведении)
table table-bordered table-striped

<table class="table table-bordered table-striped">
<thead>
<tr>
<th>Заголовок 1</th>
<th>Заголовок 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Название11</td>
<td>Название12</td>
</tr>
<tr>
<td>Название21</td>
<td>Название22</td>
</tr>
<tr>
<td>Название31</td>
<td>Название32</td>
</tr>
</tbody>
</table>
Заголовок 1 Заголовок 2
Название11 Название12
Название21 Название22
Название31 Название32
table table-bordered table-hover

<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Заголовок 1</th>
<th>Заголовок 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Название11</td>
<td>Название12</td>
</tr>
<tr>
<td>Название21</td>
<td>Название22</td>
</tr>
<tr>
<td>Название31</td>
<td>Название32</td>
</tr>
</tbody>
</table>
Заголовок 1 Заголовок 2
Название11 Название12
Название21 Название22
Название31 Название32

(выделяет строку при наведении)