Bootstrap Contextual table classes

Contextual table classes

Use contextual classes to color table rows or individual cells.

ClassDescription
.successIndicates a successful or positive action
.dangerIndicates a dangerous or potentially negative action
.warningIndicates a warning that might need attention
.activeApplies the hover color to a particular row or cell

<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!--from  w w  w .ja  v a2s.co m-->
<body style='margin: 20px;'>

     <table class="table table-condensed">
          <caption>This is the caption.</caption>
          <thead>
               <tr>
                    <th>Header 1</th>
                    <th>Header 2</th>
               </tr>
          </thead>
          <tbody>
               <tr class="success">
                    <td>Data 1</td>
                    <td>Data 2</td>
               </tr>
               <tr class="danger">
                    <td>Data 1</td>
                    <td>Data 2</td>
               </tr>
               <tr class="active">
                    <td>Data 1</td>
                    <td>Data 2</td>
               </tr>
               <tr class="warning">
                    <td>Data 1</td>
                    <td>Data 2</td>
               </tr>
               <tr>
                    <td>Data 1</td>
                    <td>Data 2</td>
               </tr>
               <tr>
                    <td>Data 1</td>
                    <td>Data 2</td>
               </tr>
               <tr>
                    <td>Data 1</td>
                    <td>Data 2</td>
               </tr>
          </tbody>
     </table>

</body>
</html>

Click to view the demo





















Home »
  Bootstrap »
    Bootstrap »




Introduction
Basic HTML Style
List
Table
Form
Layout
Navigation Bar
Button
Control