I want to add a background-image with a laravel URL in my css file. I can do this by just including path?

user_10038725 0
Viewed 1163

I want to add a background image with a laravel URL. I can do this by just including the web path itself but I would like to use Laravel URL.

Here is how I do it now in css:

.toggle.active {
  background: url("{{ asset('assets/img/cancel.png')}}");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}

but it doesn't work

laravel-6 laravel assets css php
4 Answers

You can't do that unless your CSS is in the blade file. But you can create a CSS variable in the blade and use it in CSS.

<div class="toggle" style="--img-url:{{ asset('assets/img/cancel.png')}}">

.toggle.active {
  background:url(var(--img-url))
}
user_49255480

background-image: url("{{ asset('assets/img/cancel.png') }}")

Must check your image in this 'public/assets/img' directory.

And then you also can check this by adding some height in css.

user_129160380

Make sure you have an image in assets directory then try this code

<div style="background:url({{asset('assets/img/cancel.png')}})">

Your Content Goes here

user_42467310 
<div class="product-grid" style="background-image: url(storage/{{$manga->manga_cover}})">

Use if its from your public/storage folder

user_146433370
Related