Laravel8 blade.php can't access or find css file-CodePudding

Im writing something to welcome.blade.php and want to use css to change the background but it doesnt works.(my css file is in the public folder)here is my blade.php codes;

<html lang="en">
    <head>
        <link rel="stylesheet" type="text/css" href="{{ asset('css/app.css') }}" >        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="style.css">
        <title>Laravel</title>
        </head>
<body>
    <p>adddd</p>

    </body>
</html>

and my css codes;

body{
    background-color: blue;
}

CodePudding user response：

All css files go in the public/css folder you can then add a blade link like so

CodePudding user response：

In laravel all common assets files like css, js, image, etc files should be in the public folder Put your style.css file inside the public folder location like

your_project_folder/public/css/style.css

then add this line inside the head tag

<link rel="stylesheet" type="text/css" href="{{ asset('css/style.css') }}" >

CodePudding user response：

Your file structure should like this.

Please check your css file is in public directory or not. If your app.css is inside public/css folder then you need to import as like you already imported in blade file.

Your welcome.blade.php

<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Laravel</title>
        <link rel="stylesheet" type="text/css" href="{{ asset('css/app.css') }}" >
    </head>
    <body>
        <p>adddd</p>
    </body>
</html>

And for css/app.css check is there file exists or not in this path => public/css/app.css

if not exists then create a file with this directory structure public/css/app.css and put your css code inside this file.

body{
    background-color: blue;
}

CodePudding user response：

All css files go in the resources/css folder you can then add a blade link like so {{asset(‘resources/css/style.css’)}}