KEMBAR78
Advanced CSS3 Exercises Guide | PDF | Computers
0% found this document useful (0 votes)
395 views3 pages

Advanced CSS3 Exercises Guide

The document provides instructions for three CSS3 exercises: The first asks to display the days of the week fading in and out continually using CSS3. The second asks to display an image with the left side in grayscale and right in color using CSS3. The third asks to display a paragraph spreading over multiple columns depending on screen width using CSS3 media queries.

Uploaded by

Bharti Sahani
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
395 views3 pages

Advanced CSS3 Exercises Guide

The document provides instructions for three CSS3 exercises: The first asks to display the days of the week fading in and out continually using CSS3. The second asks to display an image with the left side in grayscale and right in color using CSS3. The third asks to display a paragraph spreading over multiple columns depending on screen width using CSS3 media queries.

Uploaded by

Bharti Sahani
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Section 20.

Advanced CSS with CSS3


Exercise 1
Create an HTML document named ex01.html

using CSS3, display the days of the week: Monday;


Tuesday; Wednesday; Thursday;
Friday; Saturday; and Sunday
each day of the week should be displayed at the same position
each day of the week should take a second to fade-in, be displayed for a second, and
then take a second to fade out
the final application should continually cycle through all the
days of the week

Exercise 2
Download a color image from the Internet

Create an HTML document named ex02.html

using HTML, display the downloaded image


using CSS3:
display the left hand side of the image in gray scale
display the right hand side of the image in full color
Exercise 3
Create an HTML document named ex03.html

using HTML, display a paragraph of text


using CSS3:
if the width of the screen is greater than 900px, spread the paragraph over 4 columns
if the width of the screen is between 600px and
900px, spread the paragraph over 2
columns
if the width of the screen is less than 600px, display the paragraph in a single column

You might also like