Everything About Images & HTML

Unknown Data · 1 Everything About Images & HTML Tue Mar 30, 2010 9:37 pm

Unknown Data

Registered Member

Posts : 833
Points : 254
Age : 28
Location : Denmark
Browser : Safari

Everything About HTML Images
<img> HTML tag explained in detail

All right, here I will hope I can learn you everything about pictures, I know. If you feel something is missing please contact me over a PM, and I will figured it out. All questions about this, please contact me over PM. Everything standing in red, shoud redirectes.

The simple things:
A normal code look a like this.

<img src="URL goes here" />

But if you change it a little bit, you will now could put a text on it, when mouseover.

<img alt="Text by mouseover goes here" src="URL goes here" />

The position:
Without doing anything with the text, it will allways be in the right site of the picture. But if you again change the code a little bit, you will could chose were it would be.

<img alt="" align="Place for text here, use one of the speciel words" src="" />

There exist some speciel words, that you only will could use, here is a list with some of them:
-left (it would be placed in the right site of the picture)
-right (it would be placed in the left site of the picture)
-middle (it would be placed in the middle out of the picture)
-absBottom (it would be placed in the bottom for the picture)
-textTop (it would be placed in the top for the picture)

How big? How small?:
Normaly you just use this code and you don't have a chance to make the picture smaller or bigger.

<img src="URL goes here" />

But if you change a little bit, you will by you self, could change the width and height - look here.

<img width="The width of the image in pixels" height="The height of the image in pixels" src="" />

A frame and a invisible frame?
I think some of you out there don't no this, but you can make a frame on the picture by coding look of this code, and again it's just changed a little bit.

<img border="Number in pixels, how big the frame should be" src="" />

And you can also make the frame invisible.

<img hspace="Height in pixels of invisible frame" vspace="Width in pixels of invisible frame" src="" />

A little detail, links:
To make a link on a picture is the same way, to make a link on a text. Like this.

<a href="URL to the link page"><img src="" /></a>

And there exist tons of linkforms, but them will I not show in this tutorial.

All in all:
Here I quick show you, how the code would look if you put all the codes together.

<a href="URL to the link page"><img border="Number in pixels, how big the frame should be" hspace="Height in pixels of invisible frame" alt="Text by mouseover goes here" vspace="Width in pixels of invisible frame" align="Place for text here, use one of the speciel words" width="The width of the image in pixels" height="The heigth of the image in pixels" src="URL goes here" /></a>

Notice : This tutorial is copyrighted by WebArtz Forum. You may not publish it anywhere without written permission from the administrators.