EN
React - backgroundImage with inline style
1
points
In this article, we would like to show you how to set a background image with React inline styles.
There are two main methods for setting the background image:
1. Using imported image
import background from "./img/background_image.png";
const App = () => {
return (
<div style={{ backgroundImage: `url(${background})` }}>
// some text inside...
</div>
);
}
export default App;
2. With external URL
const App = () => {
const backgroundURL = "https://images.pexels.com/photos/459653/pexels-photo-459653.jpeg";
return (
<div style={{ backgroundImage: `url(${backgroundURL})` }}>
// some text inside...
</div>
);
};
export default App