Solucionado
import Banner from './componentes/Banner';
import Formulario from './componentes/Formulario';
function App() {
return (
<div className="App">
<Banner />
<Formulario />
<P>
bom dia
</P>
</div>
);
}
export default App;
import './Banner.css'
export const Banner = () => {
// JSX
return (
<header className="banner">
<img src="/imagens/banner.png" alt="O banner principal da página do Organo"/>
</header>
)
}
Para usar uma imagem em React, você pode importar ela, assim faz com outros componentes e funções:
import imagem from './pasta-com-as-minhas-imagens/imagem-escolhida.png';
import './Banner.css';Aí no elemento imagem, você chama ela assim:
<img src={imagem} alt="O banner principal da página do Organo"/>Seu código componente completo, ficaria assim:
import imagem from './pasta-com-as-minhas-imagens/imagem-escolhida.png';
import './Banner.css';
export const Banner = () => {
// JSX
return (
<header className="banner">
<img src={imagem} alt="O banner principal da página do Organo"/>
</header>
)
}Links úteis:
Obrigado Vanessa, fiz como você colocou e funcionou.
Imagina!
Que bom que ajudou!
Bons estudos! :D