如何向表格添加滚动条?
我已经阅读了关于将表添加到div并使用overflow:scroll
将div添加到CSS的线程但是当我向下滚动表头时消失...
此外,我希望我的页面响应(我正在使用引导程序),表行来自mysql数据库。使用CSS position:fixed
也搞砸了我的桌面..
还有其他方法吗?
我的jsp:
<table class="inflow-table ">
<thead>
<tr>
<th>
<div class="button black th-div th-div-first">ID</div>
</th>
<th>
<div class="button black th-div">Όνομα</div>
</th>
<th>
<div class="button black th-div">Προιόν</div>
</th>
<th>
<div class="button black th-div">Κατάσταση</div>
</th>
<th>
<div class="button black th-div">Ύψος<div>
</th>
<th>
<div class="button black th-div" >Gross</div>
</th>
<th>
<div class="button black th-div">Net</div>
</th>
<th>
<div class="button black th-div">Θερμ. °C</div>
</th>
<th>
<div class="button black th-div">Στάθμη Προιόντος</div>
</th>
<th>
<div class="button black th-div">Στάθμη Νερού</div>
</th>
<th>
<div class="button black th-div">Ειδ. Βάρος</div>
</th>
<th>
<div class="button black th-div">Μέγιστη Ροή</div>
</th>
<th>
<div></div>
</th>
</tr>
</thead>
<tbody >
<c:forEach items="${TankState}" var="state">
<tr>
<td>
<div class="td-div td-div-first">${state.getTank().getTankID()}</div>
</td>
<td>
<div class="td-div">${state.getTank().getTankName()}</div>
</td>
<td>
<div class="td-div">${state.getTank().getProduct().getProductName()}</div>
</td>
<td>
<div class="td-div">${state.getStatusDescription()}</div>
</td>
<td>
<div class="td-div">${state.getTank().getTankHeight()}</div>
</td>
<td>
<div class="td-div">${state.getGross()}</div>
</td>
<td>
<div class="td-div">${state.getNet()}</div>
</td>
<td>
<div class="td-div">${state.getTemperature()}</div>
</td>
<td>
<div class="td-div">
<div class="col-sm-4 my-bar">${state.getProductLevel()}m</div>
<div class="progress my-bar ">
<%
out.write("<div class='progress-bar progress-bar-danger' style='width:");
%>${state.getProductLevelPercentance()}<% out.write("%'></div>" ); %>
</div>
</div>
</td>
<td>
<div class="td-div">${state.getWaterLevel()}</div>
</td>
<td>
<div class="td-div">${state.getProductDensity()}</div>
</td>
<td>
<div class="td-div">${state.getTank().getMaxFlow()}</div>
</td>
<td>
<div class="td-div td-div-last" onclick="setValue(${state.getTank().getTankID()});"> >> </div>
</td>
</tr>
</c:forEach>
</tbody>
</table>