I do a meteo application and i want to change my background with my city.

my problem is i can change with the classic cssfile like:

body {
  font-family: 'montseratt', sans-serif;
  background-color:white;
  background-image: url('./assets/paris.jpg');
  background-repeat:repeat;

}

but when i retire it and i try in a div like this it doesn't function:

    <div style={{background_image: 'url(./assets/paris.jpg)'}}>

i don't understand why.

There is my entire code but i don't think it's useful

function Accueil()
{

  
  const [query, setQuery] = useState('');
  const [weather, setWeather] = useState({});
  const [time, setTime] = useState(Date.now());
  const [city, setCity] = useState('')
  const [fond, setFond] = useState((''))
  // Similar to componentDidMount and componentDidUpdate:
  useEffect(() => {
    const interval = setInterval(() => setTime(new Date().toLocaleString()), 1000);
    return () => {
      
      clearInterval(interval);
    };
  }, []);
  
   const sendtemp = (props) => {
    fetch('getmeteo/?city=' + props) 
    .then((response) => response.json())
    .then((responseData) => {
      responseData.temp -= 273.15
      responseData.temp = responseData.temp.toFixed(2)
      responseData.temp = responseData.temp + "°C"
      setWeather(responseData);
      const pro = props.toLowerCase()
      setFond("./assets/" + pro + ".jpg")
      const pop = pro.charAt(0).toUpperCase() + pro.substring(1)

      setCity(pop)
      setQuery('')
    })
  }
  const search = evt => {
    if (evt.key === "Enter"){
      setQuery('')
      sendtemp(query);

    }
  }

  
  return (
    <div style={{background_image: 'url(./assets/paris.jpg)'}}>

      

<main>
      
        <div className="search-box">
          <input
          type="text"
          className="search-bar"
          placeholder="Search..."
        
          onChange={e =>setQuery(e.target.value)}
          value = {query}
          onKeyPress={search}
          />
          
        </div>
              <div className="location">
              {(time)}
        </div>
        {weather.temp ? (
       <div className="weather-box">
        
       {weather.temp}
         </div>
      ) : ( <div></div>)}
        
        <div className="location">
            {city}
        </div>

        </main>
   
    <div>
      
    </div>
    </div>
    
  
  );
}

thanks for your answers