Module 5: CSS Styling

Module 5: CSS Styling

This project demonstrates CSS Styling.

The following sections demonstrate the same HTML content twice: once using the default styles, and once with custom CSS.


Unstyled

Famous Quotes

The only way to do great work is to love what you do. — Steve Jobs

Success is not final, failure is not fatal: it is the courage to continue that counts. — Winston Churchill

The two most powerful warriors are patience and time. — Leo Tolstoy

Image

beautiful flower
This picture is from https://stocksnap.io/ with CC0 (can use freely without attribution) and resized to 500px* 500px.

Transition

Hover over the box to see it changes color from light blue to orange.

Transformation

Hover over the box to see it move.

Animation

Animation box.



Styled

Famous Quotes

The only way to do great work is to love what you do.
— Steve Jobs
Success is not final, failure is not fatal: it is the courage to continue that counts.
— Winston Churchill
The two most powerful warriors are patience and time.
— Leo Tolstoy

Image

beautiful flower
This picture is from https://stocksnap.io/ with CC0 (can use freely without attribution) and resized to 500px* 500px.

Transition

Hover over the box to see it changes color from light blue to orange.

Transformation

Hover over the box to see it move.

Animation

Animation box.