javascript - 我正在为我的 ASP.NET MVC 程序使用 DataTables 插件。该表显示没有任何 CSS。为什么?
问题描述
我为这个问题困扰了 DAYS,这是不得已而为之。
我正在学习一门课程,其中讲师让我们使用 DataTables 从数据库中提取用户列表。该插件正确地从我的数据库中提取数据,并且该表的功能似乎正在工作。问题是这张桌子很丑陋,而且几乎无法使用。
我很茫然,因为我确保我的代码模仿了视频课程中的所有内容。我什至在 GitHub 中分析了我在他旁边的代码。
我什至确保将他的版本号用于插件,因为我相信该课程是在 2016-2017 年录制的。我考虑过我正在使用 Visual Stdio 2019 的事实,而他没有。另外,我记得几年前有一次大型引导更新。(DataTables 使用引导程序)
我将在下面显示一些代码,但这里是这个项目的两个仓库(Vidly): 我的仓库| 讲师的回购
由于这显然是一个 CSS 问题,我查看了我是如何导入我的 css 文件的。我在 App_start 文件夹中的 BundleConfig 文件中使用了一个包:
但和老师写的一模一样,一模一样。
最后,这是与第一张图片相关的代码,即带有相关表格的页面:
我搞不清楚了。
编辑: 昨晚我在 BundleConfig 文件中弄乱了我包含的文件,并将 dataTables 切换到 bootstrap 4并得到了更理想的结果:
正如您所看到的,这绝对是布局更好,并且具有所需的尺寸,但是悬停的行和某些文本的颜色仍然关闭且不吸引人。
解决方案
如果您的 Bootstrap 版本是 4,那么您需要为 DataTables 加载*.bootstrap4.css
/*.bootstrap4.js
文件(而不是*.bootstrap.*
为 Bootstrap 3 加载)。
更新编辑
看起来您可能还在加载 jquery.dataTables.css 文件(说明是分页中的间隙)?你可以删除它。只应加载其中一个样式文件。
顺便说一句,您遵循的教程是什么?
推荐阅读
- java - 如何处理大数组/列表
- mysql - 我可以使用自连接来获取这个表吗
- arrays - 为什么我无法在 useEffect 中设置数组?
- angular - Rxjs ~6.4.0 in Angular 8. 地图问题
- python - 对嵌套文件夹结构机器人框架中的多个测试套件使用通用套件设置和套件拆解
- html - 如何使用scss函数或mxin生成关键帧动画
- java - org.openqa.selenium.WebDriverException:会话 [xyz] 由于使用 Zalenium 的 ORPHAN 错误而终止
- python - Python wget模块不显示进度条
- c++ - 具有两个 dwDesiredAccess 的 OpenProcess 函数
- java - 如何将几个 foreach 压缩成一个 for-each?