Anchor
- It is used in HTML to hyperlink one file to another File/Document or any URL.
- href: This attribute specifies the URL (Uniform Resource Locator) of the linked resource. It can be an absolute URL (starting with "http://" or "https://") or a relative URL.
Syntax:
<a href = "/path to the link page"> Link Text </a>Example:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<p>Click on <a href="http://quipohouse.com/home" target="_blank"> this-link
</a>to go on home page of QuipoHouse.</p>
</body>
</html>Output:
Click on this-link to go to the home page of QuipoHouse.
Different attributes used in an anchor tag
The download attribute:
- When a user clicks on the hyperlink, the targeted image is downloaded.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Anchor Tag</title>
</head>
<body>
<h2>Example of download attribute in Anchor tag</h2>
<p>Click on the image to download</p>
<a href="logo.png" download>
<img src="logo.png" alt="Quipoin" width="104" height="142">
</a>
</body>
</html>Output:
The href Attribute:
- The href attribute specifies the link or URL for the <a> anchor tag to link that page to the current one.
Example:
<!doctype html>
<html>
<head>
<title>Href</title>
</head>
<body>
<h1>Example of href Attribute</h1>
<a href="https://www.google.com">Google</a>
</body>
</html>Output:
The target attribute:
- The text specifies the location to open the linked page or document.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Anchor Tag</title>
</head>
<body>
<h2>Example of target attribute in Anchor tag</h2>
<a href="https://quipoin.com" target="_blank">Quipoin
</a>
</body>
</html>Output:
target Attribute Values
| Value | Description |
|---|---|
| _blank | This action opens the linked document in a new window or tab |
| _self | By default, the linked document opens in the same frame it was clicked. |
| _parent | This command will open the document that is linked to the parent frame. |
| _top | The linked document will be displayed in the full body of the window when opened. |
| framename | The instruction states that the document linked to it should be opened in the specified iframe mentioned in the text. |
Other Examples
- Linking an email address to an anchor tag.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Anchor Tag</title>
</head>
<body>
<h2>Example of linking mail in Anchor tag</h2>
<a href="mailto:author@example.com">Send Mail </a>
</body>
</html>Output:
- Linking a phone number in an anchor tag.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Anchor Tag</title>
</head>
<body>
<h2>Example of linking phone number to Anchor tag</h2>
<a href="tel:+91123456789">+91 123456789</a>
</body>
</html>Output:
- Linking another section in an anchor tag.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Anchor Tag</title>
</head>
<body>
<h2>Example of linking sections in Anchor tag</h2>
<h3>Paragraph example 1: about Bali</h3>
<a href="#example2">Go to example 2</a>
<p> Bali is predominantly a Hindu country. Bali is known for its elaborate, traditional dancing. The dancing is inspired by its Hindi beliefs. Most of the dancing portrays tales of good versus evil. To watch the dancing is a breathtaking experience. Lombok has some impressive points of interest – the majestic Gunung Rinjani is an active volcano. It is the second highest peak in Indonesia. Art is a Balinese passion. Batik paintings and carved statues make popular souvenirs. Artists can be seen whittling and painting on the streets, particularly in Ubud. It is easy to appreciate each island as an attractive tourist destination. Majestic scenery; rich culture; white sands and warm, azure waters draw visitors like magnets every year. Snorkelling and diving around the nearby Gili Islands is magnificent. Marine fish, starfish, turtles and coral reef are present in abundance. Bali and Lombok are part of the Indonesian archipelago. Bali has some spectacular temples. The most significant is the Mother Temple, Besakih. The inhabitants of Lombok are mostly Muslim with a Hindu minority. Lombok remains the most understated of the two islands. Lombok has several temples worthy of a visit, though they are less prolific. Bali and Lombok are neighbouring islands.
</p>
<p>Bali and Lombok are neighbouring islands; both are part of the Indonesian archipelago. It is easy to appreciate each island as an attractive tourist destination – majestic scenery; rich culture; white sands and warm, azure waters draw visitors like magnets every year. Snorkelling and diving around the nearby Gili Islands is magnificent, with marine fish, starfish, turtles and coral reef present in abundance. Whereas Bali is predominantly a Hindu country, the inhabitants of Lombok are mostly Muslim with a Hindu minority. Bali is known for its elaborate, traditional dancing which is inspired by its Hindi beliefs. Most of the dancing portrays tales of good versus evil; to watch it is a breathtaking experience. Art is another Balinese passion – batik paintings and carved statues make popular souvenirs. Artists can be seen whittling and painting on the streets, particularly in Ubud. The island is home to some spectacular temples, the most significant being the Mother Temple, Besakih. Lombok, too, has some impressive points of interest – the majestic Gunung Rinjani is an active volcano and the second highest peak in Indonesia. Like Bali, Lombok has several temples worthy of a visit, though they are less prolific. Lombok remains the most understated of the two islands.</p>
<h3 id="example2">Paragraph example 2: racial equality</h3>
<p>Martin Luther King Jr. led many demonstrations against racism. He delivered his message in a non-violent manner. Some members of his movement later engaged in less peaceful protests. Luther King was detained several times. The longest jail sentence he received was four months. Martin Luther King’s famous 1963 speech, “I Have a Dream”, inspired many African-Americans to envisage a better future. Luther King was an American citizen. Nelson Mandela is a native South African. Their dreams were the same. Their battles were tumultuous. Nelson Mandela was arrested in 1962 for treason. He was incarcerated for twenty-seven years. Nelson Mandela and Martin Luther King Jr. both fought for racial equality. The intolerance of white people towards black co-inhabitants was the catalyst for years of activism. In 1994, Nelson Mandela became the first black president of South Africa. He was the first president elected by the people. Mandela and Luther King have been awarded the Nobel Peace Prize for their dedication to improving civil rights for black people. During Nelson Mandela’s best known speech in 1994, he recited “Our Deepest Fear”, an inspirational poem by Marianne Williamson. Mandela initially avoided violence but ended up resorting to it following the massacre of unarmed black Africans by the government. Martin Luther King Jr. was assassinated in 1968. </p>
</body>
</html>Output:
- Linking JavaScript to an anchor tag.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Anchor Tag</title>
</head>
<body>
<h2>Example of linking JavaScript in Anchor tag</h2>
<a href="javascript:alert('Hello Quipoin!');">Execute JavaScript</a>
</body>
</html> Output:
