Page 1 | Page 2 | Page 3 | Page 4 | Page 5 | Page 6
Backgrounds and Images
Now it's time to spice up your pages by adding some color to them. Background pictures, images, buttons, you name it, they really help making a site look better. I reccomend that the image files you use be a gif file or a jpg file. If you are scanning your own images remember to scan them at 72 dpi (Dots Per Inch) That is the best file compression to use on the net for all images. You can use other file extentions but sometimes other people might not be able to view them, or other files can even get chopped up when viewed. So PLEASE, only use .gif or .jpg files. Here are the tags you will need to know.
--------------------------------------------------------------------------------
BGCOLOR This is a background color tag. This goes inside your body tag. It will make the
background color whatever color you choose it to be.
BACKGROUND This is a background tag. The difference between this and BGCOLOR tag is, you
use an image file to set the background for the BACKGROUND tag.
<IMAGE SRC> This is an image tag. It uses a file that you direct it to, to display
the image file.
ALT This is an alternative text tag. This tag fits inside an image src tag. It displays
text instead of an image if a viewer can not view the image.
ALIGN This is an align tag. You will use this inside the image tag. It has acouple
different alignment features- center, left, right, top, bottom.
TEXT This is placed in your body tag, it changes the color of all text on your page.
--------------------------------------------------------------------------------
Ok the first new tags we are going to try is the BGCOLOR tag and the TEXT tag. You put
these tags inside your body tag. You can choose to use hexadecimals. Choose a color from
graphic below with colors and codes marked on it.
Here is an example of what the code you would type into your tag would
look like:
"#000000"
Note the # sign... you need that at the beginning of the color code number.
Some colors that you can just type in are "white, black, red, purple, green, violet,etc..) always test to see if the color comes out right in your browser. Not all browsers read tags that are written with the color. So really, you should use the chart above to select your colors.
--------------------------------------------------------------------------------
A lesson for you to try!
| Untitled - Notepad |
| File Edit Search Help |
| <HTML> <HEAD> <TITLE>Using Background colors</TITLE> </HEAD> <BODY BGCOLOR="gold" TEXT="black"> <H2>Wow, I have a background with some color!</H2> <P>Write alittle bit of text here and try using all that you've learned up till this point. Experiment!!!! Have Fun! The results are endless!!</P> </BODY> </HTML> |
OR with the #code in the body tag
| Untitled - Notepad |
| File Edit Search Help |
| <HTML> <HEAD> <TITLE>Using Background colors</TITLE> </HEAD> <BODY BGCOLOR="#FFCC33" TEXT="#000000"> <H2>Wow, I have a background with some color!</H2> <P>Write alittle bit of text here and try using all that you've learned up till this point. Experiment!!!! Have Fun! The results are endless!!</P> </BODY> </HTML> |
--------------------------------------------------------------------------------
If you did this correctly you should have a page with a gold background, and black text.
You should now try using different colors. You can get some very nice looking pages with
trying
different color combinations. After you try that a couple of times try using the
Background tag in
place of the Bgcolor tag.You use the Background tag for image file backgrounds.An
example...
<BODY BACKGROUND="http://YOUR_WEBPAGE_URL_HERE/myfile.jpg">
Where it says myfile.jpg that needs to be changed to the name of the file you want to use to be your background.
Note: Get in the habit of using the URL to your image instead of just the image file name. That will insure that your image will indeed show up on your page.