How to Add Internal HTML Links?

An internal link is an HTML link placed in the reference with the same webpage. In simple words, an internal link will navigate the user to a part of the same webpage.

The value specified inside the href of an internal link can be absolute or relative. It contains a hash sign(#) and the name of the id to refer to the linked section of the page. On clicking an internal link, the page gets scrolled automatically and displays the referred section on the screen.

Syntax

Target Attribute

The target attribute specifies where the linked page will open. By default, the linked document file opens in the same tab. However, you can change this by specifying different values for the target attribute.

The values of the target attribute are:

Example

The following piece of code shows an HTML file that has internal links.

Code

Output

Changing Link Colors in HTML

Though the link states have default HTML link colors, the users can change the colors as per requirements. The default colors are blue for an unvisited link, purple for a visited hyperlink, and red for a link in an active state. However, the default colors can be altered using HTML and CSS.

Code

HTML

CSS

Output

Linking to Parts of Other Documents

Given below is a piece of code that targets a particular section of another document. The name of the id is appended at the end of the target link with a #. The hashtag (#) is known as the fragment identifier. After opening, the target document scrolls automatically till it reaches the mentioned section. Example - <a href="https://www.link.com/webpage#idname">

Code

Output In the following example, you can see the referred link opens and then automatically scrolls to the section whose id is 'syntax'.

Learn more

• HTML Links