We've learned a lot of CSS3 tecniques that can alter HTML elements, including shadows, gradients, and filters. Now it's time to see how well you understand how these techniques work. For this assignment, you will be provided with a collection of images. These images should be changed through the use of CSS3 properties to reflect the screenshots below.
Click the Activity button below to download the source images. Then, click each screenshot below for a full-size view of each "project". Without using any image-editing software, take the source images and replicate the projects below using only HTML and CSS. Your versions do not have to be arranged in the layout shown. The focus of the assignment is demonstrating an understanding of more modern CSS techniques.
Note: The football field project requires use of both football_field.jpg and tic-tac-toe.png.
Your completed assignment should contain all of the following:
 |
|
When you're done, save your HTML file and upload it to your Neocities account. Then submit the assignment link to your teacher. You will be graded using the following rubric:
Imitations |
6 points | Each image project closely resembles the examples provided. (1 point each) |
Online |
1 point | The image projects are on a web page on Neocities. |