所以,我正在建立一个学校项目的网站,需要包括一个可排序的用户系统。
当我制作它时,我认为使用datatables插件使这个过程变得更容易会很好。但是当我将它与Bootstrap 4结合使用时,我的表格并没有伸展出来,我觉得引导程序CSS并没有与它结合使用。
有没有人知道如何让这4个一起工作以使它看起来更好?
这就是网站现在的丑陋程度:
标签的HTML / PHP:
<div class="container">
<div class="row" id="content">
<!-- Bovenste text van de site -->
<div class="col-12">
<p class="text-center" id="introtext">Hier ziet u een overzicht van alle contactpersonen.</p>
</div>
<table id="sortableTable" class="table table-hover">
<thead>
<tr>
<td>Voornaam</td>
<td>Achternaam</td>
<td>Email</td>
<td>Telefoonnummer</td>
<td>Gebruikersnaam</td>
<td>Type account</td>
</tr>
</thead>
<tbody>
<tr>
<?php
foreach ($row = mysqli_fetch_row(displayUsers("localhost", "root", "", "adresboek")) as $value
{
echo "<td>{$value}</td>";
}
?>
</tr>
</tbody>
</table>
</div> </div>
答案 0 :(得分:0)
如提供的链接https://datatables.net/examples/styling/bootstrap4中所述。你似乎忘了包括Datatables Bootstrap 4 JS / CSS文件: JS:
https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js
https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap4.min.js
CSS:
https://cdnjs.cloudflare.com/ajax/libs/twitter-
bootstrap/4.0.0/css/bootstrap.css
https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap4.min.css
确保您的页面中包含上述自定义JS / CSS Datatables Bootstrap 4。