1
resposta

[Reclamação] ERRO NAS IMAGENS

Olá, bom dia. não estou conseguindo estudar a segunda parte "JAVA SCRIPT DOM" desde de ontem... não consigo abrir a pasta pelo VS CODE e nem pelo próprio arquivo. quando pego o código pelo GitHub, o HTML e CSS funcionam mas as imagens não dão certo por serem binarias e, não estão rodando no VS CODE. já tentei de tudo mas sem sucesso. tem alguma forma de modificar essas imagens ou alguma coisa do tipo para conseguir usa-las???

1 resposta

Oi, Washington! Tudo bem?

Há uma forma bem prática de abrir os nossos projetos no VS Code (particularmente a minha favorita), em que devemos apenas abrir a pasta do nosso projeto (após extraí-lo da pasta zip baixada inicialmente) e digitar "cmd" no caminho dessa pasta, como podemos visualizar no gif abaixo:

Gif em que clica-se com cursor no caminho de uma pasta, localizado na sua extremidade superior, e digitamos cmd.

Após isso, será aberto o terminal do CMD , como mostrado no GIF acima, devemos, então, digitar o comando code . e apertarmos a tecla ENTER do nosso teclado, abrindo o VS Code com todos os arquivos presentes nesse diretório.

Somado a isso, em relação ao problema com as imagens, quando adicionamos a barra (/) no início do caminho da imagem (src="/imagens/play_arrow.png", por exemplo), estamos indicando que o caminho começa a partir da raiz do diretório, o que afeta a forma como o navegador procura a imagem.

Porém, podemos observar ao extrair a pasta zipada que a pasta "imagens" não se encontra na raiz do diretório e sim em uma pasta dentro da pasta raiz.

Devido a isso, devemos remover a barra de todos os nossos caminhos para as imagens, indicando que o caminho é relativo ao local do arquivo HTML. Deixando-os após as alterações da seguinte maneira:

<img class="app__logo-image" src="imagens/logo.png" alt="">
<img class="app__image" src="imagens/foco.png" alt="">
<img class="app__card-primary-butto-icon" src="imagens/play_arrow.png" alt="">

Espero ter ajudado! Caso tenha ficado alguma dúvida, sinta-se à vontade em comunicar, estou à disposição!

Um forte abraço e bons estudos!

Caso este post tenha te ajudado, por favor, marcar como solucionado ✓