我@extends()對 Laravel 的功能有疑問。我的觀點似乎根本沒有擴展布局。我不知道如何解決這個問題。這是主要的布局文件（它位于views>layouts>app.blade.php）： <!DOCTYPE html><html lang="{{ str_replace('_', '-', app()->getLocale()) }}"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- CSRF Token --> <meta name="csrf-token" content="{{ csrf_token() }}"> <title>{{ config('app.name', 'Pet Me') }}</title> <!-- Scripts --> <script src="{{ asset('/js/app.js') }}" defer></script> <!-- Fonts --> <link rel="dns-prefetch" href="//fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet"> <!-- Styles --> <link href="{{ asset('/css/app.css') }}" rel="stylesheet"></head><body><div id="app"> <nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm"> <div class="container"> <a class="navbar-brand" href="{{ url('/') }}"> {{ config('app.name', 'Pet Me') }} </a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <!-- Left Side Of Navbar --> <ul class="navbar-nav mr-auto"> </ul> <!-- Right Side Of Navbar --> <ul class="navbar-nav ml-auto"> <!-- Authentication Links --> @csrf </form> </div> </li> @endguest </ul> </div> </div> </nav>這是我試圖擁有該擴展應用程序的視圖之一（位于視圖> home.blade.php）：
1 回答
www說
TA貢獻1775條經驗 獲得超8個贊
您的代碼正確擴展了布局，因為它顯示了<nav>home.blade.php 文件的內容以及內容。在我看來，您的 CSS 加載不正確。
我建議您在控制臺中檢查 app.css 文件是否正確加載。如果沒有，請確保 app.css 文件位于 Laravel 項目根目錄的以下路徑中 -
public > css > app.css
此外，如果您可以共享控制臺的屏幕截圖，將會更有幫助。
Laravel 使用 app.css 文件初始化項目，該文件位于 public/css 目錄中。該文件只是Bootstrap的 CSS 文件 ( docs ) 的縮小版本。如果您的文件由于某種原因被刪除。您可以通過以下方式獲得它 -
選項 1 使用引導程序的 css 文件的 CDN。
為此，請替換<link href="{{ asset('/css/app.css') }}" rel="stylesheet"> 為 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">. 你可以從這里獲得 CDN 。
選項 2
從這里下載 Bootstrap 。
解壓下載的文件夾。
轉到 css 文件夾。
復制 bootstrap.min.css 并粘貼到 Laravel 項目的 public/css 文件夾中。
將粘貼的文件重命名為 app.css。
你的 CSS 現在應該加載了。
您的 app.css 的一個可能原因是您執行了該php artisan preset none命令，該命令刪除了 Laravel 的默認前端腳手架（docs）。
- 1 回答
- 0 關注
- 153 瀏覽
添加回答
舉報
0/150
提交
取消