Links in the same page


#1

Hey, if I have a website where everything is written in the same place and it says for example about me, contact and portfolio at the top how could I do to click about me and instead of going to another page just scroll down to where I wrote that part.


#2
<nav>
  <ul>
    <li><a href="#about"> About</a></li>
    <li><a href="#contact">Contact</a></li>
  </ul>
</nav>
<div id="about">

</div>
<div id="contact">

</div>

#3

It can only be id???


#4

Yes, only id. To a link it is what we call a fragment identifier. The hash symbol in the link refers to the top of the document, and the name that follows to the corresponding id attribute value.


#5

And how can I do so everytime that I make one of this it does not appear in blue like if it was a link and then in purple after clicking?


#6

Add a color property to your link…

a {
    color: black;
}

This property will override the user agent style sheet default colors.