boostrap里面的表格样式

<html>
<head>
    <title>Bootstrap 实例</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://apps.bdimg.com/libs/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<!--//bootrtap里面的表格样式-->
    首先引用一个<div class="container"></div>  这个是一个容器的盒子
    包内容都显示子啊屏幕的中间位置.
    <div class="table-responsive">
       <!-- responsive意思是"响应式 响应的"  table-responsive就是响应式表格
        例如  在写img自适应的时候 bootstrap里买的呢属性是<img src="" class="img-responsive">-->

        <table class="table table-bordered table-striped">
   <!--     table直接写是只有一条线
            bordered是边框
            striped是条纹 豹纹-->

            <tr><th>1</th><th>name</th><th>start</th></tr>
            <tr><td>jone</td><td>jetty</td><td>tomcat</td></tr>
            <tr><td>jone</td><td>jetty</td><td>tomcat</td></tr>
            <tr><td>jone</td><td>jetty</td><td>tomcat</td></tr>
        </table>
    </div>

</div>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://apps.bdimg.com/libs/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>

</html>

猜你喜欢

转载自blog.csdn.net/xm1037782843/article/details/53186777
今日推荐