Laravel 页面丢失 CSS 是因误用 @include 替代 @extends，导致父模板中 @yield('styles') 或 @stack('styles') 未执行；须确保子模板首行为 @extends('layouts.app')，父模板定义对应注入点，子模板用 @push('styles') 或 @section('styles') 正确注入。
在 Laravel 项目中，页面突然丢失 CSS 样式，检查发现 HTML 源码里 标签完全没渲染出来，而你只改了视图文件——大概率是误用 @include 替代了 @extends，导致父模板中定义的 @yield('styles') 或 @stack('styles') 根本没被执行。
确认你是不是把继承写成了包含
打开出问题的子视图（比如 resources/views/home.blade.php），第一行必须是：@extends('layouts.app')
如果第一行是 @include('layouts.app')、或者开头有空格/换行/UTF-8 BOM 字符、或者写了 @include('partials.header') 后直接跟 HTML 内容，那它就不是继承关系，而是静态拼接——【父模板里的 @yield 和 @stack 指令全部失效】，CSS 和 JS 链接自然不会出现。
这一步必须立刻修正：删掉所有 @include 引入布局的行为，严格保证子模板首行为 @extends，且前面无任何字符。
检查父模板是否正确定义了样式注入点
打开 resources/views/layouts/app.blade.php，确认其中至少存在以下任一写法：
方法一：使用 @yield（适合单次覆盖）@yield('styles') 或 @yield('styles', '')
方法二：使用 @stack（推荐，支持多处追加）@stack('styles')
⚠️ 注意：【@yield 和 @stack 不能混用同名区块】。如果父模板写的是 @stack('styles')，子模板就必须用 @push('styles')，而不是 @section('styles')——否则内容被丢弃且无报错。
子模板中正确注入 CSS 的两种写法
第一步：确认父模板用的是 @stack('styles')（现代 Laravel 项目默认推荐）
第二步：在子模板的任意位置（通常放在顶部或 @section('content') 内）插入：
@push('styles')@endpush
第三步：确保该子模板仍以 @extends('layouts.app') 开头，并包裹在 @section('content')@endsection 中——【@push 必须出现在 @extends 继承的上下文中才生效】。
如果父模板用的是 @yield('styles')，则子模板需写：@section('styles')@endsection
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
