Se quisermos inserir uma imagem no documento HTML para mostrar a imagem em uma página da web, temos que seguir os passos a seguir.
Usando essas etapas, podemos facilmente adicionar ou inserir uma imagem no documento.
Passo 1: Em primeiro lugar, temos que digitar o código HTML em qualquer editor de tex-to ou abrir o arquivo Html existente no
editor de texto no qual queremos inserir a imagem:
Passo 2: Agora, mova o cursor para o ponto onde queremos inserir uma imagem. E então, digite a tag <img> vazia nesse
ponto, conforme mostra o código abaixo:
Passo 3: Agora, temos que adicionar o atributo da tag de imagem cujo nome é "src". Portanto, digite o atributo src dentro
da tag<img>:
Passo 4: Depois disso, temos que indicar o caminho da imagem que queremos inserir. Então, digite o caminho da imagem no atributo src. Se nossa imagem estiver armazenada no mesmo diretório em que nosso arquivo HTML está armazenado, digite o seguinte caminho:
<img src = "nomeArquivo.extensão">
Por exemplo:
<img src = "tomate.png"> <br>
Se a imagem estiver armazenada em qualquer outro diretório, digite o caminho correto dessa imagem, para que o navegador possa ler a imagem facilmente, conforme mostra o exemplo a seguir:
<img src = "/tutoriais/html/imagens/tomate.png">
Se a imagem estiver na internet, então também podemos adicionar a imagem usando URL, conforme mostrado no exemplo a seguir:
<img src = "www.simuladosetutoriais.com/imagens/tomate.png">
Etapa 5: depois disso, também podemos definir a largura e a altura dessa imagem usando dois atributos diferentes, conforme mostrado no exemplo a seguir:
<img src = "javatpointimage.jpeg" width = "500" height = "200">
Passo 6: Por último, temos que salvar o seguinte arquivo html ou código html no editor de texto.
Veja o resultado do código acima:
