1
resposta

Dúvida ícone

Insira aqui a descrição dessa imagem para ajudar na acessibilidade Não sei o que fiz de errado, que o ícone não está dando certo :/

1 resposta

Olá, Thaislanny. Como vai?

Analisando a imagem do seu VS Code, identifiquei exatamente o que está impedindo o ícone de aparecer. O problema não está no seu código HTML, mas sim na organização das pastas (o caminho do arquivo).

Observe a sua barra lateral esquerda (Explorer):

  1. O seu arquivo index.html está dentro da pasta tecboard.
  2. O seu arquivo de ícone (icone-dark.svg) está dentro de uma subpasta chamada img.

Como corrigir:

No seu código, na linha 6, você escreveu:
href="icone-dark.svg"

Dessa forma, o navegador procura o ícone na mesma pasta onde está o HTML. Como ele está guardado dentro da pasta img, você precisa indicar esse caminho. Altere para:

href="img/icone-dark.svg"


Dicas Importantes de Estrutura:

  • Caminhos Relativos: Sempre que um arquivo estiver dentro de uma pasta, você deve "entrar" nela no código usando o nome da pasta seguido de uma barra (/).
  • Case Sensitivity: Certifique-se de que o nome do arquivo no código seja idêntico ao que está na pasta (incluindo letras maiúsculas e minúsculas).
  • Extensão: Verifique se o arquivo é realmente .svg ou se pode ser um .png. Na sua pasta img, notei que você tem tanto versões .png quanto .svg.

Outro detalhe no seu código:

Notei que na linha 12 você usou </body> e na linha 13 usou </html>. Está correto! No entanto, na imagem, parece que a tag de abertura <body> na linha 10 não foi fechada com o sinal de maior (>). Verifique se está assim: <body>.

Faça essa pequena alteração no caminho do href e salve o arquivo (Ctrl + S). O ícone deve aparecer na aba do seu navegador agora!

Espero que possa ter lhe ajudado!