Links are a great way of connecting
one webpage to another webpage.
But they can also connect one part of a webpage
to another part of that same webpage,
especially on really long webpages, like for a table of contents.
I have now added a bunch more information to this page,
so that I could give you a history of the web,
and a history of HTML versions.
And I think it's enough content that it deserves a table of contents.
And I've started one up here, just an unordered list,
with list items with each of the section titles.
And I want to link each of these section titles,
so that you can click them, and just go to that part of the page.
To do that, I once again use the `` tag,
so I'll start by just wrapping this title
in the start and end tags for ``
Now, what should go as the href of this link?
Well, we need to somehow tell the browser
where to jump to in the webpage.
Some way of uniquely identifying that part of the page.
If you've learnt CSS selectors already,
you've actually seen how to do this, in fact.
We can do it by adding an `` attribute to a tag.
Let's scroll down and find the heading here.
And we'll add an `` attribute to this heading.
So I'm going to put my cursor in ``,
type `id = "`
and come up with a good identifier that's unique,
like "web-history".
Okay, let's scroll back up to the link.
And now, in order to tell the browser to go to this internal link,
we need to start with a hash sign,
and then type exactly the id like we typed it below.
Okay, so now,
pause this talk-through, and try clicking the link.
Go on, I will wait. Clicky-clicky!
Okay, did you see it scroll down to this section?
Then it worked!
We can add more links like that
by putting the id attributes on, on every heading,
and making `` tags that point at them.
But I'll leave that for you to try.
The big to remember is that the IDs must be unique,
because otherwise the browser won't know where to jump to.
So make them nice and descriptive.