Ir ao conteúdo
  • Cadastre-se
Gabriel Almeida1998

HTML Estou tendo problemas em inserir imagens no HTML5.

Recommended Posts

Ola, espero que possam me ajudar!

Eu criei as pastas certinhas com diretórios específicos e inserir o enderenço da imagem  no código HTML5 na seguinte forma <img src="foto\HTML-Progressivo.png">, ate então tudo bem mas quando eu abro qualquer navegador para testar a imagem aparece quebrada, aparece somente um ícone de quebrada mas não a imagem.

 

Obs: Sistema Operacional Win 10

 

Código que estou usando para testar. 

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <title>Curso de HTML5</title>
        <meta charset="UTF-8" />
        <style>
            h1 {font-family:arial;
                font-size:30pt;
                color:blue;
                text-shadow:2px 2px 20px black;
            }
        </style>
    </head>
    
    <body>
        <h1>Olá. Mundo!</h1>
        <h2>Me livrando da maldição.</h2>
        <h1>Oba, Me livrei!</h1>
        <img src="\foto\HTML-Progressivo.png">
    </body>
</html>

 

Outras formas que utilizei.

<img src="foto\HTML-Progressivo.png" />

<img src="foto/HTML-Progressivo.png" />

<img src="C:\Users\Gabriel\Pictures\Teste\HTML-Progressivo.png " />

<img src="C:\Users\Gabriel\Pictures\Teste\foto\HTML-Progressivo.png " />

   <img width="320" height="54" border="solid" src="foto/HTML-Progressivo.png" alt="HTML-Progressivo.png" />

 

fiz testes ,(usando as barras \  / ) e deixando o final sem fechar , a unica forma que funcionou foi utilizando uma imagem da 

internet através do endereço URL mas com imagens do meu computador não consegui. 

Obrigado pela atenção espero que possam me ajudar ,esperando ansiosamente uma resposta.

 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Gabriel Almeida1998 Eu acho que faltou especificar o tamanho, tipo assim 

<img width="1280" height="720" src="foto\HTML-Progressivo.png" />
adicionado 1 minuto depois

Ao menos foi o que eu fiz no meu, http://fazendomuitascoisas.com.br, mas é apenas um chute, mesmo porque sei bem pouco de html

  • Curtir 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Gabriel Almeida1998 Olá,  Seja bem vindo em nosso Clube do Hardware.

 

Então, pelo que eu vi você está errando o caminho da imagem.

 

Se o arquivo está no root(raiz) você coloca direto o nome da imagem.

Se o arquivo está dentro de uma pasta e esta pasta está no root, você precisa setar a pasta onde está.

Se o arquivo está dentro de uma pasta, mas esta pasta de está dentro de outra pasta que está no root, você precisa setar o caminho relativo com com  ../

 

E sim, no html você deve usar a barra normal e não a contra-barra.

 

Veja o seguinte exemplo:

Raiz(/)
  |
  |-|imagens
  |     |-imagem.png
  |
  |-index.html

Você acessa esta imagem assim:

<img src="imagens/imagem.png"  alt=""/>

 

Agora este exemplo:

Raiz(/)
  |
  |-|imagens
  |     |-grandes
  |     |    |-imagem.png   
  |     
  |-index.html

Você acessa assim:

<img src="../grandes/imagem.png"  alt=""/>

Porque o arquivo está dentro de uma pasta, que esta pasta está dentro de outra.

Você aumenta o número de ../  quando há mais pastas em níveis acima.

 

Dica,  experimente usar o inspecionador de elementos do navegador com o F12. inspecione o elemento da imagem e verá que ele está "quebrado" porque ele não consegue achar o caminho que você colocou.

 

 

Referência para você ler: https://www.w3schools.com/html/html_filepaths.asp

 

  • Curtir 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá DiF, obrigado acho que estou chegando la , mas você poderia me mostrar como 

eu aplico isso ao código , como devo escrever nele pra assear a imagem em questão

sou iniciante ainda se não for pedir muito. Muito obrigado!Em aguardo. 

 

Muito Obrigo DiF! Consegui valeu pelas dicas, tudo certo, agora continuar os estudos valeu!  

  • Curtir 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora





Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×