Bootstrap 表格

初仔仔

于 2014-04-30 07:55:00 发布

阅读量55

点赞数

原文链接：http://www.cnblogs.com/LT0314/p/3700535.html

版权

Bootstrap 的简单表格实例

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>Example of Table with twitter bootstrap</title> 
<meta name="description" content="Creating a table with Twitter Bootstrap. Learn how to use Twitter Bootstrap toolkit to create Tables with examples.">
<link href="/twitter-bootstrap/twitter-bootstrap-v2/docs/assets/css/bootstrap.css" rel="stylesheet"> 
</head>
<body>
<table class="table">
        <thead>
          <tr>
            <th>Student-ID</th>
            <th>First Name</th>
            <th>Last Name</th>
            <th>Grade</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>001</td>
            <td>Rammohan </td>
            <td>Reddy</td>
            <td>A+</td>
          </tr>
          <tr>
            <td>002</td>
            <td>Smita</td>
            <td>Pallod</td>
            <td>A</td>
          </tr>
          <tr>
            <td>003</td>
            <td>Rabindranath</td>
            <td>Sen</td>
            <td>A+</td>
          </tr>
        </tbody>
      </table>
</body>
</html>

效果如图：

Bootstrap 的斑马表格实例

和简单实例不同的是table的class名改为 <table class="table table-striped">即可

效果如图：

转载于:https://www.cnblogs.com/LT0314/p/3700535.html

初仔仔

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Bootstrap 表格

Bootstrap 的简单表格实例<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Example of Table with twitter bootstrap</title> <meta n...
复制链接

扫一扫