Saltar al contenido

Cómo establecer una imagen de fondo en ReactOct, 26thIn este tutorial, vamos a aprender acerca de cómo establecer un fondo …

marzo 13, 2020

 

En este tutorial, vamos a aprender acerca de cómo establecer una imagen de fondo en la aplicación reaccionan utilizando estilos en línea y CSS externo.

Este tutorial asume que ya ha creado un nuevo proyecto reaccionan uso de crear una reacción aplicación. imagen Configuración

utilizando estilos en línea

Ejemplo:

import React from 'react';
import car from './images/car.png'
function App() {
return (

This is red car

);
}

export default App;

En el ejemplo anterior, en primer lugar, hemos importado la imagen del coche de las imágenes de una carpeta y la añadimos a thediv elemento utilizando BackgroundImage propiedad CSS.

Ajuste de imagen usando CSS externo

Si no te gusta la adición de imágenes de fondo utilizando los estilos en línea también podemos añadir el uso de estilos CSS externos.

Ejemplo:

import React from 'react';
import './App.css';
function App() {
return (

This is red car

);
}

export default App; .container{
background-image: url(./images/car.png);
}