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
Click to Enlarge
Target Attribute In The Anchor Tag
- blank – Opens the linked document in a new window. Consider the following code
<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>
Click to Enlarge
- _self – Opens the linked document in the same window. Consider the following code
<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>
Click to Enlarge
- _parent - Opens the link in the parent window. To check this, we will create 2 files ‘page1.html’ and ‘page2.html’. In page1.html, add the following code
<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>
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>
Click to Enlarge
- _top – Opens the link in the full body of the window
<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>
Click to Enlarge
- Framename – Open the target document in the specified frame. Consider Page1.html, page2.html and page3.html again
<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>
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>
Click to Enlarge
Browser Support
Internet Explorer | Firefox | Chrome | Safari | Opera | Edge |
---|
Yes | Yes | Yes | Yes | Yes | Yes |