Как установить фон изображения в React.js используя CSS?

#css #reactjs #import #background-image

#css #reactjs #импорт #фоновое изображение

Вопрос:

Я пытаюсь импортировать изображение в CSS для установки в качестве фона, и я просто не могу его импортировать, а изображение хранится в общей папке. У кого-нибудь есть решение?

Это код:

    background: url("../image.jpg") top left/cover no-repeat;
  display: table-cell;
  width: 50%;
}
 

Ответ №1:

Прямое использование удаления изображений не работает. В JSX вы должны импортировать изображение следующим образом:

 import img from "../../assets/image.jpg";
 

А затем установить как BackgroundImage:

 <div style={{ backgroundImage: `url(${img})` }}>example</div>
 

Комментарии:

1. Они сказали, что не могут просто импортировать его. Разве это не было бы импортом? Возможно, исходный вопрос также может быть немного понятнее…

2. Я понял, что он не может импортировать его по тому, как он это делает, поэтому я предложил изменить фон, используя style для тега в JSX

Ответ №2:

я думаю, вам следует удалить ../ и просто написать background: url("/image.jpg")