There are several ways to capture images from the web. The easiest and fastest way to enhance your image collection is to go to a site that specializes in web graphics, such as:
Once you have decided on a background that you like, RIGHT-click on it and you will see a drop-down menu.
(For THIS assignment, choose a background that does NOT have a side or top border (mine does). There is an additional code which is needed to accomodate borders, which we'll go over next week.)
Choose "save background as..." Your file manager will open and you can choose where to save it. In this assignment, you will be saving all your images to your floppy. However, please be sure to make a back-up copy of your images and your html files to a NEW FOLDER on your hard-drive (just in case). Once the image has been saved, you will use the following code:
<body background="name.format" text="color number"> Be sure to choose your OWN image name and your own text color.
Remember that image formats for the web can be .jpg and .gif but you can also use a .bmp (if your image is small).
To prevent your background from scrolling down with the text, you can assign an attribute to it: <body background="name.format" text="color number" BGPROPERTIES="fixed">
I have done that on this page as well as on the webrings page.
To save an image, RIGHT-click on the image and choose "save image (or graphic or pictures) as...
To place an image in the center of the page, use the following code:
<center>
<img src="imagename.format"> (note that an image command does NOT need a close command!)
</center>
When putting images on your pages, there are 2 things you need to remember:
1. ALWAYS link back to the clipart source using their logo
(you'll learn how in tutorial #4 Creating Links)
2. ALWAYS use the alt tag inside the immage command:
<img src="image.format" alt="message or name of image">
Remember to upload BOTH your HTML file as well as your IMAGE files.
Tutorials:
Assignments:
Back to Index