Saturday, December 24, 2016

Link to open in new window target attribute & image link - HTML5 - Web Development

Link that open in new window


How to make link to open in new window?

We had seen in before page that how to make a link. Good!. If you click that link it will open in same window in your browser. But if you want to open that link in new window there is an attribute. That is called ' target="_blank" ' attribute.

Example:

Free Ads | Insurance | Loan | Credit | Hosting

If you click the link it will open my one of website named http://www.freeadsimple.com in new window.

How the code of the link is :

<a href="http://www.freeadsimple.com/" target="_blank">Free Ads | Insurance | Loan | Credit | Hosting</a>

Just try in your computer for the above code in body of web page.

It will give you a link to open in new window

How to give link to an image


If you want to give link to image you will try this statement:


<a href="http://www.freeadsimple.com">
 <img src="free-ad-simple.jpg" alt="Free Advertisement without registration" style="width:350px;height:200px;border:0">
</a>

In the above example we should give image display statement in between the href attribute start and end.


Example code :

<!DOCTYPE html>
<HEAD>
<TITLE>Web Development Example</TITLE>
<meta charset="UTF-8">
</HEAD>
<BODY>

<a href="http://www.freeadsimple.com">
<img src="free-ad-simple.jpg" alt="Free Advertisement without registration" style="width:350px;height:200px;border:0">
</a>


</BODY>
</html>

Output of above code is:



In the above output you can see an image. If you bring your cursor there It will show hyperlink cursor when mouse over on it. And you can click that image to open http://www.freeadsimple.com website.

Thank you for reading. Will meet in next chapters.








No comments:

Post a Comment