The HTML target attribute defines the target for where to open the linked document or where to submit the form.
The HTML target attribute belongs to the following tags:
HTML <a> target Attribute
Syntax:
<a target="_blank|framename|_parent|_self|_top"> _blank – opens the linked document in a new window or tab.
framename – opens the linked document in the named iframe.
_parent – opens the linked document in the parent frame.
_self (default) – opens the linked document in the same frame as it was clicked.
_top – opens the linked document in the full body of the window.
Example:
<!DOCTYPE html>
<html>
<body>
<p>Open link in a new tab: <a href="https://www.lenastanley.com/" target="_blank">CodeLife:Animations</a></p>
</body>
</html>Output:
Open link in a new tab: CodeLife:Animations
HTML <area> target Attribute
Syntax:
<area target="_blank|framename|_parent|_self|_top"> _blank – opens the linked document in a new window or tab.
framename – opens the linked document in the named iframe.
_parent – opens the linked document in the parent frame.
_self (default) – opens the linked document in the same frame as it was clicked.
_top – opens the linked document in the full body of the window.
Example:
<!DOCTYPE html>
<html>
<body>
<img src="https://lenadesign.org/wp-content/uploads/2021/06/homeOffice.jpg" alt="homeOffice" usemap="#workmap" width="640" height="480">
<map name="workmap">
<area shape="rect" coords="34,44,270,350" alt="laptop" href="https://lenadesign.org/wp-content/uploads/2021/06/laptop.jpg" target="_blank">
<area shape="circle" coords="337,300,44" alt="coffee" href="https://lenadesign.org/wp-content/uploads/2021/06/photoshop-gif.gif" target="_blank">
</map>
</body>
</html>Output:
Click on the laptop or the cup of coffee to open an image in a new tab:
HTML <form> target Attribute
Syntax:
<form target="_blank|framename|_parent|_self|_top"> _blank – opens the linked document in a new window or tab.
framename – opens the linked document in the named iframe.
_parent – opens the linked document in the parent frame.
_self (default) – opens the linked document in the same frame as it was clicked.
_top – opens the linked document in the full body of the window.
Example:
<!DOCTYPE html>
<html>
<body>
<form action="" method="get" target="_blank">
<label for="fname">First name:</label>
<input type="text" id="first-name" name="firstname"><br><br>
<label for="lname">Surname:</label>
<input type="text" id="surname" name="surname"><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>Output:
Enjoy coding!
Read also: