bootstrap3的.tabel .danger

来源:互联网 发布:迪杰斯特拉算法流程图 编辑:程序博客网 时间:2024/06/06 03:07

      2.3版本的                       3.0版本

.table .error.table .danger

通过这些状态class可以为行货单元格设置颜色。

Class描述.active鼠标悬停在行或单元格上时所设置的颜色.success标识成功或积极的动作.warning标识警告或需要用户注意.danger标识危险或潜在的带来负面影响的动作
实验代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <link rel="stylesheet" href="dist/css/bootstrap.css">    <script type="text/javascript" src="dist/js/jquery.js"></script>    <script type="text/javascript" src="dist/js/bootstrap.js"></script><title>无标题文档</title></head><body style="margin:200px">    <table class="table">        <thead>          <tr>            <th>#</th>            <th>标题1</th>            <th>标题2</th>            <th>标题3</th>          </tr>        </thead>        <tbody>          <tr class="active">            <td>1</td>            <td>这个是active的效果</td>            <td>这个是active的效果</td>            <td>这个是active的效果</td>          </tr>          <tr>            <td>2</td>            <td>内容栏</td>            <td>内容栏</td>            <td>内容栏</td>          </tr>          <tr class="success">            <td>3</td>            <td>这个是success的效果</td>            <td>这个是success的效果</td>            <td>这个是success的效果</td>          </tr>          <tr>            <td>4</td>            <td>内容栏</td>            <td>内容栏</td>            <td>内容栏</td>          </tr>          <tr class="warning">            <td>5</td>            <td>这个是warning的效果</td>            <td>这个是warning的效果</td>            <td>这个是warning的效果</td>          </tr>          <tr>            <td>6</td>            <td>内容栏</td>            <td>内容栏</td>            <td>内容栏</td>          </tr>          <tr class="danger">            <td>7</td>            <td>这个是danger的效果</td>            <td>这个是danger的效果</td>            <td>这个是danger的效果</td>          </tr>        </tbody>      </table></body></html>

效果图: