在laravel中运行特定部分页面的特定css而不覆盖页面其他部分的css？

Let's elaborate my problem. Think we have 3 template files 1.Master 2.Child(home) 3.navbar layout(included in home)

Mater->home->navbar

i have 2 external css files which have this css

p
{
color:red;
}

and

p
{
color:blue;
}

1st css file is linked in master.blade.php and 2nd css file is linked into navbar.blade.php

I want text color of navbar as blue and text color of home(other than navbar) as red.

Now the output is blue(overriding css which is declared in master).

I don't want to modify css(specificity), Is there anything in laravel like scopes for css.

Are you familiar with blade into laravel?

I think you should define a yield section in your master

@yield('css')

and then call it in your navbar or etc ... like this

 @section('css')
     p
     {
      color:red;
     }
    @endsection

and in other files

 @section('css')
 p
 {
  color:blue;
 }
@endsection

Why don't you check the current route, then echo the color in style attribute in-line in your blade file:

@if(request()->is('/'))
    <!-- Homepage -->
    <p style="color:red">Hello</p>
@else
    <!-- All Other Pages -->
    <p style="color:blue">Hello</p>
@endif

or

<p style="color:{{ request()->is('/') ? 'red' : 'blue' }}">Hello</p>

Why don't you just assign an ID to the different paragraph blocks and target them that way? Or even better, create a utility class for each colour.

.text-red {
   color: red;
}

And then...

<p class="text-red">Lorem ipsum[...]</p>