I cannot place the image next to the title using tag link

Asked

Viewed 1,126 times

-2

<title>Biografia - João da Silva</title>
<meta charset="utf-8">
<link rel="icon" href="favicon.png">
<h1>Sobre mim</h1>

<p>Moro em São Paulo mas atendo clientes do mundo todo. Sou conhecido por fazer produtos de qualidade, durabilidade e que agregam valor para meus clientes.</p>

(Even using the image directory after href I cannot place the image) (which would be this) (C: Users Dante Desktop Programming folder-Alura html-css-javascript favicon.png)

javascript html css html5

  • you want to show the image in the browser tab or on your page?

  • want to show on tab

  • tries to give a Ctrl + F5 on your page to see if it appears

  • Your image has to be in the same folder as your . html, then just put the tag <link rel="icon" href="favicon.png"> within the head. And check if the image extension is even . PNG or something else

  • Which browser is using?

  • to using Chrome and Firefox Leandro.

  • Hugo I haven’t put the head yet, is that why the image is already in the same folder

  • Gabriel read the answer below, she will help you solve this

Show 3 more comments

1 answer

1


The structure of your Document is wrong, the recommended is that the tags <link>, <title> and <meta> must be inside the <head>

Ex:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Biografia - João da Silva</title>
    <meta charset="utf-8">
    <link rel="shortcut icon" href="favicon.ico">
</head>
<body>

</body>
</html>

Imagery

inserir a descrição da imagem aqui

For the image to load it is enough that it is in the root of the directory in which the file is also .HTML

Thus the href of your Favicon would look like this: href="favicon.ico", because it is at the same root as the .html

Saving it in the same directory as the index page of the site, save in format .ico (most browsers will support favicons in more common formats like .gif or .png, but using ICO format will ensure that it works as well as Internet Explorer 6 .)

Source: You can read more in this Mozilla documentation: https://developer.mozilla.org/en-US/docs/Aprender/HTML/Introducao_ao_HTML/The_head_metadata_in_HTML#Adicionando_%C3%ADcones_personalizados_ao_seu_site

It is indicated that the image is in the same part as the .html as said, but if you want to put in another folder this question will help you solve the problem: Path to access html folders ,css,php etc

  • 1

    Thanks for the help, I tbm did change the image from png to jpg, and it worked not only that but it worked well to put everything in its proper place as head and body. I made some 3 verses of the same code and with changes all of them and it worked, Thanks for the help, I’m learning to program now so I’m having these difficulties. VLW

  • @Gabrieldasilvasantos without problems young, what I did was very basic. I strongly suggest that I am looking for courses in Alura, Udemy or any other online platform and buy a basic HTML/ CSS curve. You won’t spend 30 dicks and you’ll learn a lot!! And if you don’t want to spend anything on Youtube you have a lot of basic material to get you started! Take a few hours to study the basics, it will help you for the rest of your life. Abs

Browser other questions tagged javascript html css html5

You are not signed in. Login or sign up in order to post.