How To Link Two HTML Pages Together
Last Updated : Mar 11, 2024
IN - HTML | Written & Updated By - Pragati
In this article we will show you the solution of how to link two html pages together, HTML uses hyperlink to link to another on the Web. the <A> tag is used to create an anchor to link from.
The href attribute is used to address the document to link to, and the anchor tag will close displayed as a hyperlink.
Step By Step Guide On How To Link Two HTML Pages Together :-
As we know, HTML hyperlink tag is used to link between two HTML pages.
The <a> tag is used to create an anchor to link. All the customization and done within this tag. We will also see that how to put image as a link and style it using CSS.
As we know that our today’s concept is about how to link two HTML pages. Let us do it.
<!DOCTYPE html>
<html>
<head>
<title>HTML Links</title>
<style>
/* unvisited link */
a:link {
color: blue;
text-decoration: none;
}
/* visited link */
a:visited {
color: red;
text-decoration: none;
}
/* hovering over the link */
a:hover {
color: green;
text-decoration: underline
}
/* activated link */
a:active {
color: brown;
text-decoration: underline
}
</style>
</head>
<body>
<h1>visit our website</h1>
<a href="https://www.http://talkerscode.com/">visit</a>
<a href="default.asp">
<img src="https://images.freeimages.com/images/previews/218/my-dog-cutter-1499799.jpg" alt="Hyperlink" style="width:50px;height:45px;">
</a>
</body>
</html>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title.
- Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
- Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
- Here, in body, we create an <a> element, the href attribute. We can define where the linked document will be open with the target attribute. If the browser cannot find a named anchor that has been specified , it goes at the top of the document.
- We can also put image as link by using a <img> tag putting into <a>.
- Here, we give different values in pixels to height by using inline CSS and you can see that the width of the image increases with an increase in height given in pixels and vice versa. We hope that you understand the concept of height.
- Now we can also customize the link as an example the color of the link changes as we hover over the link, visited the link, or when the link is still active. We add colour and text decoration here.
- At last, the <body> and <html> tags are closed with </body> and </html> respectively.
Conclusion :-
At last here in conclusion, here we can say that with the help of this article we are able to link two html pages.
I hope this article on how to link two html pages together helps you and the steps and method mentioned above are easy to follow and implement.
About Pragati
