HTML MADE EASY

  
Free Graphics | Graphics Optimizer | Resources | Freeware
JPEGCruncher Desktop | T-Shirts

HTML TUTORIAL
Introduction
Lesson1:Tags
Lesson2:Paragraphs
Lesson3:Attributes
Lesson4:Lines
Lesson5:Graphics
Lesson6:Alignment
Lesson7:Links
Lesson8: Tables
Lesson9: Frames

HTML EXTRAS
Uploading Webpages
Quick Reference
Color Chart
Free Web Graphics
Graphics Optimizer
Resources
Free Software


Html Tutorial Book

Html Made Easy is now a book! Don't spend money on books you won't understand, The Complete Html Made Easy takes you every step of the way in building a website, and it makes it fun and easy too!

More Info

Did You Know

Graphics should be used in moderation and they should have a file size no bigger than 10K That's because graphics slow down the loading of a webpage.

Personalize It


Personalize mugs, mousepads and keepsake boxes with just about any name.

MUGS
MOUSEPADS
KEEPSAKE BOXES
LICENSE PLATE FRAMES

Lesson 6: Alignment


Aligning Text With Graphics
If you tried to align a paragraph with a picture you know how frustrating it can be. After the first line the text jumps right down and underneath the picture. To stop that from happening use the ALIGN attribute in the IMG SRC tag:

<IMG SRC="graphicname.gif" ALIGN="left">

This makes the text flow down the side of the picture. Example:

<IMG ALIGN="left" SRC="pups.jpg"> <I> See how the text here is going down the picture?<BR>The align attribute makes this possible.</I>

Result:

See how the text here is going down the picture?
The align attribute makes this possible.

Did you notice the <I> </I> tag I put in? Use the tags you learned, otherwise you'll forget.

To start your sentence or paragraph a little further down the picture use a couple of <BR> tags before you begin typing your text:

<IMG SRC="pups.jpg" ALIGN="left"> <BR> <BR> <BR> <I>See how the text here is starting a little further down the picture?<BR> The break tags make this possible.</I>

Result:




See how the text here is stating a little further down the picture?
The break tags make this possible.


If your paragraph ended before it reached the bottom of the picture and you want to start a new line of text below the picture, use the CLEAR="all" attribute in the <BR> tag:

<BR CLEAR="all">

Art Online

Puppy Posters
Cute puppy posters made from original art. Not sold in any store.

Pet Portraits
Pet portraits made from your photos.

Framed Prints
Framed and unframed prints and posters of birds and flowers.

Wildlife Art
Wildlife watercolor paintings and pen and ink drawings.


 It goes right after the text that's aligned with the picture:

<IMG ALIGN="left" SRC="pups.jpg"> <BR> <BR> <I> See how far down the text here starts?<BR>The BR tags make it happen. <BR CLEAR="all"> See how this line of text starts below the picture? The CLEAR attribute did it. </I>

Result:



See how far down the text here starts?
The BR tags make it happen.
See how this line of text starts below the picture? The CLEAR attribute did it.

Experiment a little with the tags, see what kind of results you can get and then find out how to put links on your page in Lesson 7


Graphics | Graphics Optimizer | Resources | Freeware