table headers

This commit is contained in:
Mark Otto 2014-07-13 23:45:34 -07:00
parent 3e896193ab
commit d60d34231a
9 changed files with 690 additions and 1758 deletions

1077
dist/css/bootstrap.css vendored

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -40,6 +40,73 @@ Due to the widespread use of tables across plugins like calendars and date picke
</table>
{% endexample %}
## Table head options
Use one of two modifier classes to make `<thead>`s appear light or dark gray.
{% example html %}
<table class="table">
<thead class="thead-inverse">
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<td>2</td>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<td>3</td>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
<thead class="thead-default">
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<td>2</td>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<td>3</td>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>
{% endexample %}
## Striped rows
Use `.table-striped` to add zebra-striping to any table row within the `<tbody>`.

View File

@ -1638,6 +1638,14 @@ table th[class*="col-"] {
border-bottom: 0;
}
}
.table > .thead-inverse > tr > th {
color: #fff;
background-color: #373a3c;
}
.table > .thead-default > tr > th {
color: #55595c;
background-color: #eceeef;
}
fieldset {
min-width: 0;
padding: 0;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -231,3 +231,18 @@ table {
}
}
}
.table > .thead-inverse {
> tr > th {
color: #fff;
background-color: @gray-dark;
}
}
.table > .thead-default {
> tr > th {
color: @gray;
background-color: @gray-lighter;
}
}