ASP.NET Core使用DataTables分页样式异常，如何调整为目标设计？

• 移除分页冲突配置
  你当前的初始化代码中开启了scroller滚动加载插件，该插件会和传统点击分页功能冲突，如果你需要使用点击式分页，删除scrollY、scrollCollapse、scroller三个配置项即可。
  调整后的初始化代码参考：

$(document).ready(function () {
    $('#AllUsers').DataTable({
        processing: true, // 用于显示进度条
        serverSide: false, // 关闭服务端处理模式
        filter: true, // 启用过滤（搜索框）功能
        orderMulti: false, // 禁用多列同时排序
        "pagingType": "full_numbers",
        pageLength: 5,
        lengthMenu: [1, 3, 5, 20, 50, 100, 200, 500],
        deferRender: true,
        paging: true,
        "columnDefs":
            [{
                "targets": [0],
                "visible": false,
                "searchable": false
            }],
    });
});

• 确认样式文件引入
  DataTables的分页按钮样式依赖配套的CSS文件，确保你在项目中引入了对应版本的DataTables样式文件。如果你的项目使用Bootstrap框架，引入适配Bootstrap的DataTables样式包后，分页会自动渲染为标准按钮样式。
• 自定义样式调整
  如果默认样式不符合你的预期，可以通过自定义CSS覆写分页样式，示例代码如下：

/* 分页按钮通用样式 */
.dataTables_paginate .paginate_button {
    padding: 6px 12px;
    margin: 0 2px;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    text-decoration: none;
    color: #337ab7;
}
/* 当前选中页样式 */
.dataTables_paginate .paginate_button.current {
    background-color: #337ab7;
    border-color: #337ab7;
    color: #fff;
}
/* 鼠标悬浮样式 */
.dataTables_paginate .paginate_button:hover:not(.current):not(.disabled) {
    background-color: #eee;
    border-color: #ddd;
}
/* 禁用按钮样式 */
.dataTables_paginate .paginate_button.disabled {
    color: #999;
    cursor: not-allowed;
}

内容的提问来源于stack exchange，提问作者Ikram Ullah Khan