Articles → HTML → Anchor tag in HTML

Anchor tag in HTML






Syntax


<a href=”page_name”>text</a>



Sample


<html>

<head>
	<title>Anchor Demo</title>
</head>

<body> <a href="page1.html">Click here to go to page1</a> </body>

</html>



Output


Picture showing the output of anchor tag

Click to Enlarge




Target attribute in anchor tag






<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> <a href="http://google.com" target="_blank">Click here to go to google</a> </body>

</html>




Picture showing the output of anchor tag when target type = '_blank'

Click to Enlarge



<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> <a href="http://google.com" target="_self">Click here to go to google</a> </body>

</html>




Picture showing the output of anchor tag when target type = '_self'

Click to Enlarge



<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body>
	<iframe src="Page2.html"></iframe>
</body>

</html>






<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> <a href="http://google.com" target="_self">Click here to go to google</a> </body>

</html>




Picture showing the output of anchor tag when '_self' is used instead of '_parent'

Click to Enlarge



<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> <a href="http://google.com" target="_parent">Click here to go to google</a> </body>

</html>




Picture showing the output of anchor tag when target type = '_parent'

Click to Enlarge







<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body>
	<iframe src="Page2.html"></iframe>
</body>

</html>




<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> This is frame 2
	<iframe src="Page3.html"></iframe>
</body>

</html>




<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> <a href="http://google.com" target="_top">Click here to go to google</a> </body>

</html>




Picture showing the output of anchor tag when target type = '_top'

Click to Enlarge







<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body>
	<iframe src="Page2.html" name="framePage1"></iframe>
</body>

</html>




<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> This is frame 2
	<iframe src="Page3.html" name="framePage2"></iframe>
</body>

</html>




<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> <a href="http://google.com" target="framePage2">Click here to go to google</a> </body>

</html>




Picture showing the output of anchor tag when target type is frame

Click to Enlarge



<html>

<head>
	<title>Anchor Target Demo</title>
</head>

<body> <a href="http://google.com" target="framePage1">Click here to go to google</a> </body>

</html>




Picture showing the output of anchor tag when target type is frame

Click to Enlarge


Browser support


Internet ExplorerFirefoxChromeSafariOperaEdge
YesYesYesYesYesYes



Posted By  -  Karan Gupta
 
Posted On  -  Saturday, December 26, 2015
 
Updated On  -  Sunday, April 02, 2017

Query/Feedback


Your Email Id  
 
Subject 
 
Query/FeedbackCharacters remaining 250