Bootstrap CSS 表格

来源:互联网 发布:资源优化配置理论 编辑:程序博客网 时间:2024/05/17 05:19

中文官方资料:http://v3.bootcss.com/css/#tables
此博客用来记录

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title>    <link rel="stylesheet" href="bootstrap.min.css"></head><body>    <div class="table-responsive">        <!--表格的响应式:外层div添加 class="table-responsive"-->        <!--table-striped 斑马线表格   table-bordered 加边框表格 table-hover 鼠标经过时高亮的表格   table-condensed 紧凑型表格-->        <table class="table table-bordered">            <!--表格标题  thead-->            <!--单元格状态:active success info warning danger-->            <thead>                <tr class="active">                    <th>表格标题</th>                    <th>表格标题</th>                    <th>表格标题</th>                </tr>            </thead>            <!--表格内容-->            <tbody>                <tr class="success">                    <th>表格单元格</th>                    <th>表格单元格</th>                    <th>表格单元格</th>                </tr>                <tr class="info">                    <th>表格单元格</th>                    <th>表格单元格</th>                    <th>表格单元格</th>                </tr>                <tr class="warning">                    <th>表格单元格</th>                    <th>表格单元格</th>                    <th>表格单元格</th>                </tr>                <tr class="danger">                    <th>表格单元格</th>                    <th>表格单元格</th>                    <th>表格单元格</th>                </tr>            </tbody>        </table>    </div></body></html>
0 0