Ok, enough of that, there is still a bit of work to do on the other four images that consist of the left side. Open up Paint Shop Pro and then open the files called "cornerll.gif", "cornerlr.gif", "cornerul.gif", and the "cornerur.gif".
Each of these images is laid over each of the four corners of the box that makes up the side left and gives the impression that the box has curved corners.
To make these images create this illusion, let's look first at the "cornerul.gif" file. The process to edit this file can then be repeated with the other three corner files.
Zoom in on the image (make it larger) so that it is easier to work with. This can be done with the "Pan Tool", or a scroll button on a mouse can be used to make the image larger. Just put the mouse over the image and scroll in and out.
Increase the color depth of the image to give more color options to work with.
Single left click on the foreground color to open up that color window.
Enter in the number of the color for your border in the box on the bottom called "HTML". (Don't forget that number sign.)
Click Ok to get ready to paint your new border. Select the "Paint Brush" from the left side menu. Make sure the bush is only one (1) pixel wide. To do this, look in the "Size" box at the top of the screen and change that number to "1".
Using the paint brush and your left mouse button, change the black line on the image to your new border color.
Change the paint brush color to the color listed as the background on the Pre-Planning Template. This is so the image will cover up the square corner so all that is seen is the rounded one. For this course we will be using the color green.
Color the corner above the curve the same as the background color listed on the Pre-Planning Template. This way it will blend into the background of the website.
Change the paintbrush to a completely different color and paint the inside of the curve that color. This will be the transparency color.
Single left click on the angle bracket between the foreground and background color to swap the two colors putting the background color of the image as the background color of the image palette.
Go up to "Image" on the top menu, and then down to "Set Palette Transparency".
Set the Palette Transparency to the background color and click OK. Then go ahead and save the file.
Now do the same thing to the other three corner images.
When all of the images are done being edited, upload all of them to the web server..
Open up your website in a new window and take a look at those corners. The backgrounds won't match quite yet, but notice how each of the corners covers up the square corners to make them look rounded. And since the inside of the curves are transparent, the background of the box can be changed in the cascading style sheet (CSS) without having to adjust the images.
