BootStrap Panel

来源：互联网发布：网络律师编辑：程序博客网时间：2024/05/01 18:31
摘自《极客学院》
1、效果图：
2、html代码：
<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <link rel="stylesheet" href="bootstrap.min.css">    <title></title></head><body>    <div class="container">        <div class="panel panel-default">            <div class="panel-body">                Hello,World!!            </div>        </div>        <div class="panel panel-default">            <div class="panel-heading">                花果山大钻风            </div>            <div class="panel-body">                分地位ur国内部分地方可加工方法简单<br>                分地位ur国内部分地方可加工方法简单<br>                分地位ur国内部分地方可加工方法简单<br>                分地位ur国内部分地方可加工方法简单<br>            </div>            <div class="panel-footer">                2015-08-04            </div>            <div class="panel panel-default">                <div class="panel-heading">                    546321789                </div>                <div class="panel-body">                    huagnwufdgrqwe                </div>                <table class="table">                    <thead>                        <tr class="active">                            <th>列标题</th>                            <th>列标题</th>                            <th>列标题</th>                        </tr>                    </thead>                    <tbody>                        <tr class="success">                            <td>表格单元格</td>                            <td>表格单元格</td>                            <td>表格单元格</td>                        </tr>                        <tr class="success">                            <td>表格单元格</td>                            <td>表格单元格</td>                            <td>表格单元格</td>                        </tr>                        <tr class="success">                            <td>表格单元格</td>                            <td>表格单元格</td>                            <td>表格单元格</td>                        </tr>                    </tbody>                </table>            </div>        </div>        <div class="panel panel-default">            <div class="panel-heading">                WORLD            </div>            <div class="panel-body">                hello,world!!            </div>            <ul class="list-group">                <li class="list-group-item">                    item111                </li>                <li class="list-group-item">                    item111                </li>                <li class="list-group-item">                    item111                </li>                <li class="list-group-item">                    item111                </li>            </ul>        </div>    </div></body></html>
0 0