Search Blog

Creating a Image Links in an HTML Document | Adding images in an HTML document

Creating image links is as same as creating text links. Simply add an "img" tag after the "a href" tag. Border, width & height of the image can also be changed or edited using "border", "width" & "height" tags respectively in the "img" tag.

General format/syntax for creating an image link is:
<a href="[link]"><img src="[picture url]"></a>
Replace [link] with the link to open when someone clicks on the image and [picture url] with the URL of the image, if your image is located on the server itself then simply type its name.

For Example:


Input:

<a href="https://www.akblogs.com/"><img src="http://t0.gstatic.com/images?q=tbn:ANd9GcQg-Biq2eH0YU9V8rggCyKE061HLF3UD3F3s22x4_H2tr9dXi0t=1h=163w=228usg=__sq3X1Dt26v0FmXCCYMOO2tTxbd4=" /></a>

Output:


The adress of this image is "http://t0.gstatic.com/images?q=tbn:ANd9GcQg-Biq2eH0YU9V8rggCyKE061HLF3UD3F3s22x4_H2tr9dXi0t=1h=163w=228usg=__sq3X1Dt26v0FmXCCYMOO2tTxbd4=" Clicking this image will open "https://www.akblogs.com/".

Now the example for border, width & height tags:


Input:
<a href="https://www.akblogs.com/"><img border="1" height ="250" src="http://t0.gstatic.com/images?q=tbn:ANd9GcQg-Biq2eH0YU9V8rggCyKE061HLF3UD3F3s22x4_H2tr9dXi0t=1h=163w=228usg=__sq3X1Dt26v0FmXCCYMOO2tTxbd4=" width="250" /></a>

Output:


In this example the width and height of the image is 250 pixels. It can be altered and the same image for different sizes can be obtained. The thickness of the border is set to 1, it is purple coloured. It can be thickened by increasing its value.
If no border is required then simply enter "0" in the border. The system will set no border to the image by default.

Related: Best Ad Networks 2018

I hope this article helps you, I will be writing more on these sorts of Articles and don't forget to follow my blog Ali Khan Blogs on facebook at Akblogspk.
Share:

No comments:

Post a Comment