Почему я получаю несколько изображений на 1 странице

Question

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

Вот мой css код:

.servicesHero {
 background-image: url("./images/Resized.jpeg");
 min-height: 60vh;
}

Вот мой компонент героя:

import React from 'react'

export default function Hero({children, hero}) {
return (
    <header className={hero}>
        {children}
    </header>
)
}

Hero.defaultProps = {
hero: "defaultHero"
};

А вот вызов на странице услуг:

import React from 'react'
import Hero from '../Components/Hero'

export default function Services() {
return (
    <Hero hero="servicesHero" />
);
}

Вот результат с повторным изображением:

Answer 1

помимо используемого css, вы должны добавить свойство css, чтобы не повторять фоновое изображение

  .servicesHero {
     background-image: url("./images/Resized.jpeg");
     min-height: 60vh;
     background-repeat: no-repeat;
    }

для получения дополнительных ссылок см.