How to change background image of div?

Question

This is my code:

<div style = {{ backgroundImage: "url(img.jpg)" }} className="card">
    <h3>{character.name}</h3>
</div>

This code doesnt work. Output just white color

That's not valid HTML. If you're using a framework, be sure to include its tag. — Heretic Monkey, Jun 03 '20 at 12:45
@rrakhlin please provide more detail and code regarding the question — Aditya toke, Jun 03 '20 at 12:56
Does this answer your question? [Setting a backgroundImage With React Inline Styles](https://stackoverflow.com/questions/39195687/setting-a-backgroundimage-with-react-inline-styles) — Nick Song, Jun 03 '20 at 12:58
@rrakhlin provided you the generic solution which will work irrespective of your any js framework — Aditya toke, Jun 03 '20 at 13:03

score 0 · Accepted Answer · answered Jun 03 '20 at 12:58

0

Try this:

<div style={{ backgroundImage: `url(${require("img.jpg")})` }} className="card">
    <h3>{character.name}</h3>
</div>

answered Jun 03 '20 at 12:58

Karveiani

score 0 · Answer 2 · answered Jun 03 '20 at 13:03

0

Providing you the generic solution which will work in any javascript frameworks.

HTML

<div id="parentDiv" className="card">
    <h3>XYZ </h3>
</div>

JS

document.getElementByID('parentDiv').style.backgroundImage = "url('your_image_name.png')";

answered Jun 03 '20 at 13:03

Aditya toke

2 Answers2