Overview
This is where you'll add more pizzaz to your page, we're going to add some more color, make things move, and give your page a personality. This is where the REAL fun begins.
Backgrounds
First off, I'm going to show you how to make your background a solid color. One thing you need to know about adding color, is there's two ways to do it, weather its for text or a background, table borders...whatever. The background tag is <body bgcolor="color you want here">. You can replace the green text with simply a name of a color like "red" or "purple". That's the easier way to do it, however you don't have that many choices. The other way to tell the computer what color you want is to enter that color's hexidenial code. In other words, the code for red is "#FF0000". Don't worry, no one expects you to memorize these..there are plenty of site that have a cheat sheet. Try Web Monkey.
You can also add an image as your background. The normal, easy code for adding a background image is <body background="URL of you background image">, and if you're still not sure you're completly getting this whole HTML thing, jsut use that one. But, if you're feelin frisky, let's try this more complecated one:
|
This is the basic tag for adding background images. Replace the green text with the URL of your background image, and the red text with the the attribute. For more info on what and attribute is and what they all do, scroll down just a bit. |
<STYLE TYPE="text/css">
<!--
BODY {background-image:image URL; background-repeat:attribute}
-->
</STYLE>
|
Ok, now it's time to fill in that attribute part(the red text). What you put in there tells the computer what you want it to do with the background image.
Attribute(what it does) |
Code(what to type in) |
|
Makes the image repeat like a tile effect through the whole page, just like it would using the simpler background tag. |
repeat |
|
Makes the image appear only once in the top left hand corner of your page. |
no-repeat |
|
Makes the image tile vertically, along the left hand side of your page. |
repeat-y |
|
Makes the image tile horizantally, along the top of your page. |
repeat-x |
Moving Text
This is the really cool stuff! It's really easy, too compared to that last one! But I kept my promise..HTML is mainly just cut and paste. If you haven't figured it out yet, you can jsut copy the HTML tags from my page or any other page and paste them into your page editor. Here's a few tags to and...pizzaz!
|
Makes text blink.For some reason, blinking text does not show up when I view pages throught my browser, this m not work for all people viewing your page. |
|
<blink>blinking text</blink>
|
This is a scrolling marquee. There's about a million different ways you can change these, and I have a whole other section on it, but here's the basic tag. You can replace "left" with "right". |
|
<marquee behavior=scroll direction="left">Scrolling message</marquee> | |
Other Text Tags
|
Regular textSuperscript |
<sup> |
|
Regular TextSubscript |
<sub>
|
StrikeThrough |
<strike> |
|
Regular text Typewriter |
<tt> |
Font Color
You can change font color using either just the name of the color you want to replace the green text or the hexidemal code, just like when you're doing backgrounds.
<font color="color here">.
You can also change the font style, I really wouldn't reccomend this, however. What fonts you have on your computer the people viewing your page might not have on theirs, so I would reccomend sticking with the regular font. The font tag that you would want to use is this: Replace the green text with what fonr you want to use, the red text with the size you want it to be (this is NOT the same as the heading tags, the smaller the number, the smaller the size) and the orange text with what color you want your font to be, and the purple text with your own text.
<font face="font name" size="font size" color="font color">your text here</font>