More Alignment
<IMG ALIGN="?">
aligns an image.
Using the image align tag, you can control where the image is
placed on the page. For instance, you can line it up on the left:
<IMG ALIGN="LEFT"
SRC="anikokosax.gif">
Which pushes it to the left:

Or you can line it up on the right:
<IMG ALIGN="RIGHT"
SRC="anikokosax.gif">
Which pushes it to the right:

Centering an image is a little trickier, because <IMG
ALIGN="CENTER"> doesn't work on most browsers.
Instead, you'll have to first center the paragraph, with <P
ALIGN="CENTER"> (even if you don't have any text),
and then place the image.
So, to center the anikokosax, we'd write:
<P ALIGN="CENTER"><IMG
SRC="anikokosax.gif">
And it would appear like this:
Image Borders
<IMG BORDER="#">
sets the border size of an image
The image border is the line that appears around the edge of a
picture placed on a Web page. Normally, this border will only
appear if you use the image as a link; however, you can create a
border of any size around your image by using the <IMG
BORDER="#"> tag, and
replacing the #
with a border size, from 0-99, 0 being the smallest.
You can also prevent a border from appearing around a linked
image by setting the border size to zero (<IMG
BORDER="0">).
Our normal image, with the border unspecified
has no border at all:
<IMG SRC="anikokosax.gif">
But we can add a border, using <IMG
BORDER="#">.
<IMG BORDER="5"
SRC="anikokosax.gif">
<IMG BORDER="15"
SRC="pointme.gif">
<IMG BORDER="30"
SRC="anikokosax.gif">
Wrapping Text Around Images
<IMG ALIGN="LEFT"> aligns an image to the left side of the
page.
<IMG ALIGN="RIGHT"> aligns an image to the right side of the
page.
<IMG ALIGN="TOP"> aligns text along the top of an
image.
<IMG ALIGN="BOTTOM"> aligns text along the bottom of an
image.
<IMG ALIGN="MIDDLE"> aligns text to the middle of an image.
Pictures are a nice addition to your home page, but you'll
probably want to have some words with them. Here's how to put
them together.
There are several ways for wrapping text around pictures, and
they're controlled through the <IMG
ALIGN> tags. For starters, you can align an
image down the left or right side of a page and let the text flow
around it.
So, for instance, you can lead a paragraph off with the
image, aligned left:
<P><IMG
ALIGN="LEFT" SRC="anikokosax.gif"> This is
a
anikokosax.gif. It may not
look like a normal picture but it has many uses. You can use it
for linking things. You have to remember that we are on the
internet and there will be many things that you will run across
that could look very strange to you. After a while you will get
used to the bizarre and will probably be shocked when you see
something normal!</P>
The text will begin at the top of the image and flow down
its right-hand side:
This is a
Anikokosax.gif. It may not look like a
normal picture but it has many uses. You can use it for
linking things. You have to remember that we are on the
internet and there will be many things that you will run
across that could look very strange to you. After a while you
will get used to the bizarre and will probably be shocked
when you see something normal!
But sometimes you'll want the text to begin above the image
and wrap around it. In this case, you can integrate the image
into the paragraph:
<P> This is a anikokosax.gif. It may not look like a normal picture<IMG ALIGN="LEFT"
SRC="anikokosax.gif"> but it has many
uses. You can use it for linking things. You have to remember
that we are on the internet and there will be many things
that you will run across that could look very strange to you.
After a while you will get used to the bizarre and will
probably be shocked when you see something normal!
And the image will appear on the left-hand side, beginning
at the first line after it was inserted. The
text will wrap around it:
This is a anikokosax.gif. It may not look like a normal
picture
but it has many
uses. You can use it
for linking things. You have to remember that we are on the
internet and there will be many things that you will run
across that could look very strange to you. After a while you
will get used to the bizarre and will probably be shocked
when you see something normal!
<IMG ALIGN="RIGHT"> works the same way, and
will look like this:
This is a anikokosax.gif.It may not look like a normal
picture
but it has many
uses. You can use it
for linking things. You have to remember that we are on the
internet and there will be many things that you will run
across that could look very strange to you. After a while you
will get used to the bizarre and will probably be shocked
when you see something normal!
There's no way to align an image in the center of the page and
have text wrap around both sides. You can, however, center an
image in the page and have the text run below it. To do
this, you'll need to use the paragraph alignment tag,
rather than the image alignment tag, as well as a line
break.
So this HTML:
<P
ALIGN="CENTER"><IMG
SRC="anikokosax.gif"> <BR>This is a anikokosax.gif. It may not
look like a normal picture but it has
many uses. You can use it for linking things. You have to
remember that we are on the internet and there will be many
things that you will run across that could look very strange
to you. After a while you will get used to the bizarre and
will probably be shocked when you see something normal!
Will look like this:

This is a anikokosax.gif. It may not look like a normal picture
but it has many uses. You can use it for linking things. You
have to remember that we are on the internet and there will
be many things that you will run across that could look very
strange to you. After a while you will get used to the
bizarre and will probably be shocked when you see something
normal!
Wait...there's still more: If you'd like a single line of
text to appear next to the image, and the rest to drop below it,
you can use the <IMG
ALIGN="TOP">, <IMG
ALIGN="MIDDLE">
and
<IMG
ALIGN="BOTTOM"> tags.
<IMG
ALIGN="TOP"> looks like this:
This
is a anikokosax.gif. It may not look like a normal picture but
it has many uses. You can use it for linking things. You have
to remember that we are on the internet and there will be
many things that you will run across that could look very
strange to you. After a while you will get used to the
bizarre and will probably be shocked when you see something
normal!
<IMG
ALIGN="BOTTOM"> looks like this:
This is a
Anikokosax.gif. It may not look like a normal picture but it has
many uses. You can use it for linking things. You have to
remember that we are on the internet and there will be many
things that you will run across that could look very strange
to you. After a while you will get used to the bizarre and
will probably be shocked when you see something normal!
And <IMG
ALIGN="MIDDLE"> looks like this:
This is a
anikokosax.gif. It may not look like a
normal picture but it has many uses. You can use it for
linking things. You have to remember that we are on the
internet and there will be many things that you will run
across that could look very strange to you. After a while you
will get used to the bizarre and will probably be shocked
when you see something normal!
These rules may seem like a lot to memorize, but as long as
you understand the concepts, you'll do just fine. Don't forget,
there's no shame in looking things up. If you just don't want to
memorize, you can always bookmark this page for future reference.
|