HTML Anchor Links and Named Anchors

 

6. Anchor Links and Named Anchors

Anchor Links (<a> Tag)

The <a> tag is used to create hyperlinks to external websites, other pages, or sections within the same page.

Attributes:

  • href: Specifies the URL or link destination.
  • target: Determines how the link opens (_blank for a new tab, _self for the same tab).
  • title: Provides additional information about the link (displayed as a tooltip).
  • rel: Specifies the relationship between the current page and the linked page.

Example:

<a href="https://www.example.com" target="_blank" title="Visit Example Website">Visit Example</a>

Explanation:

  • href: Specifies the link destination.
  • target="_blank": Opens the link in a new tab.
  • title: Displays a tooltip when the user hovers over the link.

Named Anchors

Named anchors allow users to navigate to a specific section within the same page by defining an anchor point using the id attribute.

Example:

<!-- Defining an anchor -->
<h2 id="section1">Section 1</h2>
<p>This is content for Section 1.</p>

<h2 id="section2">Section 2</h2>
<p>This is content for Section 2.</p>

<!-- Linking to the anchor -->
<a href="#section1">Go to Section 1</a>
<a href="#section2">Go to Section 2</a>

Explanation:

  • The id attribute identifies specific sections on the page.
  • Links with href="#section1" or href="#section2" navigate to the respective sections.

Comments

Popular posts from this blog

Introduction to Computer

History of Computer

Computer Generation