阅读(3764)
赞(18)
Bootstrap自定义table列表
2016-09-08 18:54:00 更新
css代码:
table.smoth{width:100%} table.smoth thead tr.caption td.item{background-color: #E4E4E4;border:1px solid #ccc} table.smoth tbody tr.list td{border:1px solid #ccc} table.smoth tbody tr.list:nth-child(odd) td{background-color: #fff} table.smoth tbody tr.list:nth-child(even) td{background-color: #F2F2F2}
html代码:
<div class="table"> <table class='smoth' > <thead> <tr class='caption'> <td class='item'>电视剧名称</td> <td class='item'>上线日期</td> <td class='item'>ITV状态</td> <td class='item'>导演</td> <td class='item'>编剧</td> <td class='item'>主演</td> </tr> </thead> <tbody> <?php for($i = 0; $i < 10; $i++):?> <tr class='list'> <td>咱俩的事</td> <td>2013-01-13</td> <td>是</td> <td>David Zhang</td> <td>David</td> <td>Zhang</td> </tr> <?php endfor;?> </tbody> </table> </div>尝试一下 »
加入了一点php代码,实则是一个简单的循环