带斑马线的表格

  

<h1>斑马线表格</h1>
<table class="table table-striped">
   <thead>
     <tr>
       <th>表格标题</th>
       <th>表格标题</th>
       <th>表格标题</th>
     </tr>
   </thead>
   <tbody>
     <tr>
       <td>表格单元格</td>
       <td>表格单元格</td>
       <td>表格单元格</td>
     </tr>
     <tr>
       <td>表格单元格</td>
       <td>表格单元格</td>
       <td>表格单元格</td>
     </tr>
     <tr>
       <td>表格单元格</td>
       <td>表格单元格</td>
       <td>表格单元格</td>
     </tr>
     <tr>
       <td>表格单元格</td>
       <td>表格单元格</td>
       <td>表格单元格</td>
     </tr>
   </tbody>
 </table>

刚已经说了,Bootstrap为表格不同的样式风格提供了不同的类名,主要包括:

  ☑  .table:基础表格

  ☑  .table-striped:斑马线表格

  ☑  .table-bordered:带边框的表格

  ☑  .table-hover:鼠标悬停高亮的表格

  ☑  .table-condensed:紧凑型表格

  ☑  .table-responsive:响应式表格

posted @ 2016-06-29 21:00  lonecloud  阅读(2122)  评论(0编辑  收藏  举报
我的博客即将同步至 OSCHINA 社区,这是我的 OSCHINA ID:lonecloud,邀请大家一同入驻:https://www.oschina.net/sharing-plan/apply