Como adicionar um link para uma foto

Com uma única linha de código HTML, você pode adicionar uma imagem clicável para quase qualquer site. Há duas coisas que você precisa para isso funcionar. Você precisará do URL para uma imagem, e você precisará do URL de um site.

Passos

Método 1 de 2:
Escrevendo o código HTML
  1. Imagem intitulada 769114 1
1. Crie um arquivo HTML. Abra um editor de texto e crie um novo arquivo. Salve o arquivo como índice.html.
    • Você pode usar qualquer editor de texto desejado, mesmo os editores de texto do sistema fornecido pelo Windows, notepad e no Mac OS X, Textedit.
    • Se você quiser usar um editor de texto destinado a trabalhar com HTML, Clique aqui Para baixar Atom, um editor de texto que funciona no Windows, Mac OS X e Linux Sistemas operacionais.
    • Se você estiver usando o TextEdit, antes de começar a escrever o arquivo HTML, clique no menu Formatar e, em seguida, clique em Fazer texto simples. Essa configuração garantirá que o arquivo HTML seja carregado corretamente em um navegador da Web.
    • Processadores de texto, como o Microsoft Word, não são ótimos para escrever HTML, porque adicionam caracteres invisíveis e formatação que podem quebrar um arquivo HTML para que ele não seja exibido corretamente em um navegador da Web.
  • Imagem intitulada 769114 2
    2. Copie e cole o código HTML padrão. Selecione e copie o código HTML abaixo e cole-o em seu índice aberto.Arquivo HTML.
  • Imagem intitulada 769114 3
    3. Encontre o URL da imagem. Encontre uma imagem na Internet, clique com o botão direito do mouse na imagem e, dependendo do seu navegador, clique em Copiar o URL da imagem, copie o endereço da imagem ou copie o local da imagem.
      • Firefox e Internet Explorer usam o local da imagem da cópia. Chrome usa URL de imagem de cópia. O Safari usa o endereço de imagem de cópia.
  • Imagem intitulada 769114 4
    4. Adicione o URL da imagem. No índice.Arquivo HTML, clique e arraste para selecionar URL de imagem com o mouse e pressione Ctrl + V para colar o URL da imagem.
  • Imagem intitulada 769114 5
    5. Adicione o URL de destino. No índice.Arquivo HTML, Excluir URL de destino e digite https: // Google.com.
      • Você pode usar qualquer URL que você deseja para o URL de destino.
  • Imagem intitulada 769114 6
    6. Salve o arquivo HTML.
  • Imagem intitulada 769114 7
    7. Abra o arquivo HTML em um navegador da Web. Clique com o botão direito do mouse no índice.Arquivo HTML e abra-o no navegador da sua escolha.
      • Quando o navegador é aberto, se você não vir a imagem, verifique se o nome do arquivo de imagem é soletrado corretamente no índice.Janela do editor de texto HTML.
      • Quando o navegador é aberto, se você vir código HTML em vez da imagem de fundo, seu índice.O arquivo HTML foi salvo como um documento de texto rico. Você pode querer tentar editar o arquivo HTML em um editor de texto diferente.
  • Método 2 de 2:
    Entendendo o código HTML
    1. Imagem intitulada 769114 8
    1. Entenda a tag de âncora. O código HTML é composto de tags abertas e fechadas. O tag é a tag aberta e é a tag fechada. É chamado de uma tag de âncora e é usado para adicionar links a uma página da web.


    • Os diz a um navegador para renderizar um link. O href é curto para referência HTML, o = diz ao navegador para levar tudo entre o " " e faça um link. Qualquer URL pode ir entre as duaspas.
    • Os informa um navegador que a tag de âncora está fechada.
    • Quando você adiciona texto entre e ele fará esse texto um link clicável em uma página da web. Por exemplo, Google criaria um link para o Google.
  • Imagem intitulada 769114 9
    2. Entenda a tag da imagem. O tag é uma etiqueta de fechamento auto. Você pode fechá-lo escrevendo escrevendo .
  • A tag diz a um navegador para renderizar uma imagem. O src é curto para a fonte, o = diz ao navegador para levar tudo entre o " " e obter a imagem desse local.
  • O /> Diz um navegador para fechar a tag da imagem.
  • Por exemplo, {} obteria a imagem nesse URL e, em seguida, exibi-lo em um navegador da Web.
  • Imagem intitulada 769114 10
    3. Use este código em qualquer lugar. Agora que você conhece este código, você pode usar para adicionar imagens clicáveis ​​a qualquer página da Web que possa renderizar código HTML.
  • Pontas

    Compartilhe na rede social:
    Semelhante