Laravel Blade页面Laravel与Bootstrap分页样式冲突致UI异常的修复方法

方法一：直接指定Bootstrap分页视图 #

在Blade文件里调用links()时，明确指定对应Bootstrap版本的分页视图，替换原代码即可：

• 若使用Bootstrap 5：

<div class="text-center mt-4">
    {{ $results->links('pagination::bootstrap-5') }}
</div>

• 若使用Bootstrap 4：

<div class="text-center mt-4">
    {{ $results->links('pagination::bootstrap-4') }}
</div>

这样Laravel会直接渲染Bootstrap风格的分页组件，不再加载默认的冲突样式。

方法二：全局设置默认分页视图 #

如果项目所有分页都需要Bootstrap样式，可以在app/Providers/AppServiceProvider.php的boot方法里添加全局配置，后续直接调用links()就会自动用Bootstrap样式：

use Illuminate\Pagination\Paginator;

public function boot()
{
    // 设置默认分页视图（对应Bootstrap 5）
    Paginator::defaultView('pagination::bootstrap-5');
    // 简单分页的视图配置（可选）
    Paginator::defaultSimpleView('pagination::simple-bootstrap-5');
}

方法三：自定义分页视图（按需定制） #

如果需要更个性化的样式，先通过命令发布Laravel的分页视图文件：

php artisan vendor:publish --tag=laravel-pagination

执行后，分页视图会被导出到resources/views/vendor/pagination目录下，你可以修改对应版本的视图文件（比如bootstrap-5.blade.php），调整HTML结构和类名，彻底规避样式冲突。

内容的提问来源于stack exchange，提问作者Sky_0820