问题描述:

I'm using Stacktable.js to make some tables responsive, but I'm working with a table that doesn't have an unique head, because the structure goes like this:

$(function(){

$('table').stacktable()

})

table{

border-collapse: collapse;

margin: 20px;

}

td,th{

border: 1px solid #000;

padding: 8px;

}

.small-only{

position: relative;

margin-top: 60px

}

.small-only:before{

content: 'MOBILE TABLE';

position: absolute;

top: -30px;

width: 100%;

text-align: center;

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="https://files-stackablejs.netdna-ssl.com/stacktable.min.js"></script>

<table>

<thead>

<th>Title 1</th>

<th>Title 2</th>

<th>Title 3</th>

<th>Title 4</th>

<th>Title 5</th>

</thead>

<tbody>

<td>Content 1</td>

<td>Content 2</td>

<td>Content 3</td>

<td>Content 4</td>

<td>Content 5</td>

</tbody>

</table>

相关阅读:
Top