Adding Colors and Pictures to Tables
Before you begin typing the HTML tags you need to create a picture for the title
Begin by creating an images folder in your unit 4 folder.
1. Go to http://cooltext.com
2. Choose a logo style
3. Type the title of your web page in the "Logo Text" box.
4. Change "text size" to 50.
5. Click on the "logo" tab.
6. Select "gradient" to change the color to one appropriate for the color you have chosen for your project.
7. Click on the "image" tab.
8. Click on the dropdown menu for "File Format".
9. Select ".PNG w/ Transparency"
10. Click on "Create Logo"
11. Right Click on your logo and select "save picture as"
12. Save as colorstitle. (no space between the word colors and title)
13. Save it in your unit 4 images folder
1. Go to http://cooltext.com
2. Choose a logo style
3. Type the title of your web page in the "Logo Text" box.
4. Change "text size" to 50.
5. Click on the "logo" tab.
6. Select "gradient" to change the color to one appropriate for the color you have chosen for your project.
7. Click on the "image" tab.
8. Click on the dropdown menu for "File Format".
9. Select ".PNG w/ Transparency"
10. Click on "Create Logo"
11. Right Click on your logo and select "save picture as"
12. Save as colorstitle. (no space between the word colors and title)
13. Save it in your unit 4 images folder
- Open a new notepad
- Type the CSS HTML tags into your note pad document.
- Choose a color that you would like to use for this project.
- Change the color word to the color your have chosen.
- Change the pictures to represent the color you have chosen. (find the pictures in your resource folder)
- Create an Images folder in you unit 4 folder. Make sure your copy the images from you resource folder into your images folder
- Choose 8 colors from the color chart that represents different color variations of the color you have chosen.
- Change the words to the names of colors from the color chart.
- Change the Font color for all words to match the name of the colors your have chosen. Make sure your words can be clearly seen.
- Change the cell color for all 8 cells to white.
- Save your document as CSS_A5.html in your unit 4 folder.
- Check to see if your webpage looks correct.
- Troubleshoot: compare your HTML code with the one below to see if you have made any mistakes.
- Submit your assignment using the assignment form below.