Use this Dropdown Box to navigate to our other pages.
You'll find everything here!
ow it's time to add some decor to your page. Let's talk about your Background Image. You don't have to use one, but if you like the cool backgrounds you've seen on the internet these days, well here is the code:
<BODY background="redbg.jpg">
You must upload the image to your directory and then type the image name (in this case, it was redbg.jpg) inside your BODY tag as I did in the example above. Remember, it is only one of the attributes that goes in the body tag. We'll talk about the others a little later. And although you may use an image on your page, you should always type in a background color (bgcolor="#0000ff") as well, for those that turn off the graphics in their browsers. You add your background image and color like this:
That would make your background color blue if you do not have an image or as I said above, for those that surf without graphics turned on. And your image would be like the background you see on this page since that IS the name of MY background image.
So now you have an HTML document started with the background and bgcolor set. You should also be able to write inside your document. Your page in your editor should look something like this: (After viewing, close the pop-up window.) Click here for an example
Now go try this example: Ex.2
ow let's move on to your main image. After you've uploaded it to your directory, this is how you write the code to place an image on your page:
<img src="picture.jpg">
his goes in between your body tags: <BODY>IMAGE and text goes here somewhere!</BODY>. A lot of things, in fact almost everything, will go in between these tags. You can place your image wherever you want it on the page. And just so you'll know, the letters "img src" stand for image source. This tells the browser where the image is at in your directory. This one would be in your main directory. You may write it like this as long as your images ARE in your main directory, but let's say you decide to put them in their own directory and call it images. Okay, now we need to change the code a bit, so here it is:
<img src="images/picture.jpg">
And just so you are clear on this, I want to explain a little furthur. I'm the worst person in the world when it comes to giving directions to a particular address, but I'll try my best here. As you can see, I use Angelfire to host my web site. Thus all my images are on Angelfire also. When I signed up, I had to choose a name for my directory. I chose de2/irishcreme. So my URL became http://www.angelfire.com plus de2/irishcreme. Adding these two together makes my ADDRESS/URL and to write the source or URL for the image, this is how you do it:
For the most part, while working on your page, you will only need to specify the particular directory that your image is in. So once again we'll place this one in your main directory since that is the most likely place you'll start out in at the beginning. Then all you'll have to write is the name of the image, like this:
asy, huh? Okay, let's center that image on the page. To do that, we write it like this:
<center><img src="picture.jpg"></center>
gain we opened and closed the tag.
Width and height are two essential attributes in your image tags if you want your page to load faster. That way your visitors don't get tired of waiting and leave before they see your fabulous artwork. To add these, you place them inside your image tag, like so:
<img src="picture.gif" width=20 height=30 ALT="my picture">
Your image width and height have now been defined for your viewer's browsers. You will notice that I also added an attribute in the image tags. The ALT tag provides alternative text to describe your image. This tells your viewer what your picture is, for those that turn off their graphics. That way, they can choose to see it if they want to. For an example, hold your cursor over my Basic HTML logo at the very top of this page. Can you see the ALT tag?
Are you ready to move on to TEXT? That would be Lesson 3. See you there!