You are using a previous version of Active Jump.

Go To Current Version of This Page

Active Jump Logo


Information
The Basics
Text
Pictures
Spacing
Colors
Links
Alignment
Lists/Bullets
Tables
Frames
Multimedia
Forms
ISO Characters
Meta Tags
Contact Us


Email Support
Email Contact

Divider

Align Pictures
Introduction
Aligning pictures can help you better space out your web site and make it easier for your visitors to read. In this section you will learn the tags that will help you align your pictures in different areas.
Align Left
Here, you will learn how to align your picture to the left of the screen. The tag to align the picture left is ALIGN="LEFT". This adds onto the picture tag so the final result looks like:

<IMG SRC="url" ALIGN="LEFT">

index.html - Notepad
....<BODY>

<IMG SRC="images/ex.gif" ALIGN="LEFT">

</BODY>....

My Homepage - Microsoft Internet Explorer




Align Right
Here, you will learn how to align your picture to the right of the screen. The tag to align the picture right is ALIGN="RIGHT". This adds onto the picture tag so the final result looks like:

<IMG SRC="url" ALIGN="RIGHT">

index.html - Notepad
....<BODY>

<IMG SRC="images/ex.gif" ALIGN="RIGHT">

</BODY>....

My Homepage - Microsoft Internet Explorer




Align Center
Here, you will learn how to align your picture to the center of the screen. The starting tag is <CENTER> and the closing tag is </CENTER>. The picture(s) between these two tags is what is aligned to the center.

index.html - Notepad
....<BODY>

<CENTER>

<IMG SRC="images/ex.gif">

</CENTER>

</BODY>....

My Homepage - Microsoft Internet Explorer


Align Top
This functions specifies where the text is placed in relation to the picture. Here, the text will be placed at the top of the picture. The tag to align the text to the top of the picture right is ALIGN="TOP". This adds onto the picture tag so the final result looks like:

<IMG SRC="url" ALIGN="TOP">

index.html - Notepad
....<BODY>

<IMG SRC="images/ex.gif" ALIGN="TOP">

Welcome To My Site

</BODY>....

My Homepage - Microsoft Internet Explorer
Welcome To My Site



Align Middle
This functions specifies where the text is placed in relation to the picture. Here, the text will be placed in the middle of the picture. The tag to align the text to the middle of the picture right is ALIGN="MIDDLE". This adds onto the picture tag so the final result looks like:

<IMG SRC="url" ALIGN="MIDDLE">

index.html - Notepad
....<BODY>

<IMG SRC="images/ex.gif" ALIGN="MIDDLE">

Welcome To My Site

</BODY>....

My Homepage - Microsoft Internet Explorer
Welcome To My Site



Align Bottom
This functions specifies where the text is placed in relation to the picture. Here, the text will be placed at the bottom of the picture. The tag to align the text at the bottom of the picture right is ALIGN="BOTTOM". This adds onto the picture tag so the final result looks like:

<IMG SRC="url" ALIGN="BOTTOM">

index.html - Notepad
....<BODY>

<IMG SRC="images/ex.gif" ALIGN="BOTTOM">

Welcome To My Site

</BODY>....

My Homepage - Microsoft Internet Explorer
Welcome To My Site



Test Your HTML
Printer Friendly Version


Jonathan David VerLee
webmaster@activejump.com


White