Bootstrap 3在桌子上放了圆角。当我应用.table-bordered类时,我应该应用哪些样式来让他们回来?
更新
从Bootstrap获取的CSS 2.3.2:
.table-bordered { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .table-bordered thead:first-child tr:first-child > th:first-child,.table-bordered tbody:first-child tr:first-child > td:first-child,.table-bordered tbody:first-child tr:first-child > th:first-child { -webkit-border-top-left-radius: 4px; border-top-left-radius: 4px; -moz-border-radius-topleft: 4px; } .table-bordered thead:last-child tr:last-child > th:first-child,.table-bordered tbody:last-child tr:last-child > td:first-child,.table-bordered tbody:last-child tr:last-child > th:first-child,.table-bordered tfoot:last-child tr:last-child > td:first-child,.table-bordered tfoot:last-child tr:last-child > th:first-child { -webkit-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; -moz-border-radius-bottomleft: 4px; }
<table class="table table-hover table-responsive table-bordered"> <thead> <tr> <th style="width: 50%"> Config. Name </th> <th> API Calls </th> <th> Current Amount </th> <th> Actions </th> </tr> </thead> <tbody> <tr> <td> <a href="/searchsources/details">Agennda</a> </td> <td> 2,876 </td> <td> $ 80.67 </td> <td> <a href="/searchsources/details">Edit</a> </td> </tr> </tbody> </table>
解决方法
如果你用一个面板围绕桌子,你会得到你的圆角。
喜欢这个:
<div class="panel panel-default"> <table class="table table-bordered"> .... </table> </div>