引导3 - 静态表头实现

Question

我不知道哪个是处理引导3中的静态表头并保持引导表css类的响应式设计的最佳方式。

所以<滚动表格行时，>标签应该是静态的。

<table class="table table-striped"> 
    <thead> 
    <tr> 
    <th>Col1</th> 
    <th>Col2</th> 
    <th>Col3</th> 
    <th>Col4</th> 
    </tr> 
</thead> 
<tbody> 
<tr> 
    <td>Some data..</td> 
    <td>Some data..</td> 
</tr> 
.... 

Answer 1

我不能评论，因为我没有足够的代表。

因此，基本上你想关闭bootstrap中thead元素的响应部分？只是正常？

Answer 2

CSS

tr { 
width: 100%; 
display: inline-table; 
height:60px; 
table-layout: fixed; 

} 

table{ 
height:300px; 
display: -moz-groupbox; 
} 
tbody{ 
    overflow-y: scroll; 
    height: 200px; 
    width: 100%; 
    position: absolute; 
} 

HTML

<table class="table table-striped"> 
    <thead> 
    <tr> 
    <th>Col1</th> 
    <th>Col2</th> 
    <th>Col3</th> 
    <th>Col4</th> 
    </tr> 
</thead> 
<tbody> 
<tr> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
</tr> 
<tr> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
</tr> 
<tr> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
</tr> 
<tr> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
</tr> 
<tr> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
    <td>Some data..</td> 
</tr> 

试试这个..