CODEWITHSUNDEEP
c#asp.netasp.net-core
Arian Shahalami
Arian Shahalami

Reputation: 1449

How to change an element's background-image url in ASP.NET Core

Im using ASP.NET Core 2.2. I don't knwo how to change background url of an element.

This is HTML of page

 <div>
    <a class="img-holder" href="#"></a>
 </div>

And this is CSS part

.img-holder
{
  background-image: url('myimg.jpg');
}

I want to change the background image of .img-holder and retrieve the url from my data base.

I don't want to use img tag.

Upvotes: 0

Views: 5413

Answers (2)

Ryan
Ryan

Reputation: 20116

Make sure the image path is correct.Then use display property to show the image and use height and width to define the image size.For example:

<div>
   <a class="img-holder" href="#"></a>
</div>

.img-holder {
        width: 500px;
        height: 500px;
        display: inline-block;
        background-image: url("myimg.jpg");

    }

Upvotes: 0

Shahzad
Shahzad

Reputation: 1695

If you are using Razor syntax and MVC, you can populate your viewmodel or ViewBag with the URL of the image. Then you can populate the image in the view using 

 <div>
    <a href="#" style="background-image: @Url.Content('image-url')"></a>
 </div>

By the way, you are also missing closing double quotes for your class

Upvotes: 4

Related Questions