- <a> tag defines a hyperlink, which is used to link from one page to another page.
Key Characteristics of HTML Anchor Links
- Specified by the <a> tag.
- Also known as hyperlinks.
- Used to link one document to another.
- Includes a closing tag <a>
Syntax
Attributes of the Anchor Tag
- href attribute: Specifies the URL or destination the link points to.
- target attribute: Specifies where the linked content will be displayed (e.g., _blank for a new window/tab).
Target Attribute Values
- _blank: Opens the linked document in a new window or tab.
- _top: Opens document in the full body of the window.
- _self: Opens document in the same window or tab (default behavior).
- _parent: Opens the linked document in the parent frame.
- download: Suggests that the target will be downloaded when clicked.
- title: Provides additional information when hovering over the link.
- id: Assigns a unique identifier to the anchor for linking within the page.
- class: Assigns a class for styling or JavaScript interactions. style: Applies.
Linking to Specific Sections on same page
<!DOCTYPE html>
<html>
<head>
<title>My Webpage</title>
</head>
<body>
<!-- Link at the top -->
<a href="#gardening-tips">Go to Gardening Tips</a>
<!-- Some content -->
<p>Here is some other content...</p>
<!-- Gardening Tips Section -->
<h2 id="gardening-tips">Gardening Tips</h2>
<p>This section provides tips on how to garden...</p>
</body>
</html>
</body>
</html>
Link colors
- Active: Displayed in red and underlined like this sentence
- Visited: Appears purple and underlined like this sentence
- Unvisited: Shown as blue and underlined like this sentence
INTERVIEW QUESTIONS: HTML ANCHOR TAG
- How can you create a link within the same webpage that takes the user to a specific section or element on the page?
- To create a link that takes the user to a specific section or element within the same webpage, you can use the anchor (a) tag's href attribute along with the id attribute of the target element.
2. What's the difference between relative and absolute URLs in the href attribute?
- Relative URLs are URLs that are relative to the current page's URL
- Absolute URLs are complete URLs, including the protocol (http/https) and domain.
3. How does the download attribute work in the anchor tag?
- The download attribute suggests that the linked resource should be downloaded instead of navigated, prompting the user to download the file.
4. How do you create an HTML link that opens the user's default email client with a specific email address?
<a href="mailto:test@gmail.com">Send email</a>
5. How can you create a clickable link in HTML that allows users to directly initiate a phone call when clicked?
- To create a link that enables users to initiate a phone call when clicked, you can use the anchor tag's href attribute with the tel: protocol.
<a href="tel:+1234567890">Call Us</a>
Do leave your comments