How to use links in HTML
How to create links to different pages in html?
How to use a image as link?
Link: <a> </a> <a href=” “></a>
Lets us consider you have two pages test.html and test1.html.
You want to give a link in test.html so that others can click on it and go to test1.html.
The tag used is “a” with attribute named “href”
Example Code:
<a href=”test1.html”> Click to test1.html </a>
Result:
Click to test1.html
So the tag should be used as above.
The text in between the tag will be displayed on the page.
On clicking the text the user will be taken to the page defined in the attribute href
Link using Images:
Even images can be used for creating links.
Its simple.
Give the image in between the “a” tags.
Example Code:
<a href=”test1.html”> <img src=”./test.jpg”> </a>
Result:
You can see. Its so simple.
In the previous case we gave the text as link.
Now we have given image as a linking code.
I want to create links that will open the pages in new window?
How can I link to website?
Opening link in new page:
Many a times we want to open the links in new window.
It’s simple.
Use the attribute “target=_blank” inside the tag “<a>”.
Example Code:
<a href=”test1.html” target=”_blank”> Click to test1.html </a>
Result:
Click to test1.html
Click on the link to test. It will open the page in new window.
How can I link to an external website?:
The tag is same as other, only thing is that we have to use “http://”.
So to link to google.com we have to use “http://www.google.com”.
Example Code:
<a href=”http://www.google.com”> Google </a>
Result:
Google
This will take you to the website.
I want to create links that can be used for mailing?
How to create a mailto link?
HTML Email:
Its simple.
In the href attribute we have to use the text “mailto”.
Format will be as “mailto:” then mailid.
Example Code:
<a href=”mailto:test@test.com“> Click to email </a>
Result:
Click to email
Creating a link that doesn’t go anywhere:
You can create a link that will not go to any page when you click on it
Example Code:
<a href=”#nowhere”> No Destination </a>
Result:
No Destination
No related posts.
Related posts brought to you by Yet Another Related Posts Plugin.




Comments
Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!
You must be logged in to post a comment.