In-Class Exercises

ICE 1 | ICE 2 | ICE 3 | ICE 4 | ICE 5

Between weeks 2 and 8 of this course, your instructor will deliver comprehensive, hands-on, in-class tutorials on responsive HTML/CSS and Bootstrap. For each in-class exercise (ICE), you are given a starting document(s) and a screenshot(s) of the final outcome. By the end of each class, you should modify the starting document to recreate the final HTML and CSS documents – as close as possible to the provided screenshot. All of your code should be validated with the HTML Validator and CSS Validator before submission.

In-Class Exercise 1

Media Queries (2%)

Due week 2: September 13 (at the end of class)

Recreate the following screenshot using HTML and CSS. Do not forget to validate your HTML and validate your CSS.

In-Class Exercise 1 screenshots

Downloads:

In-Class Exercise 2

Bootstrap Intro (2%)

Due week 4: September 27 (at the end of class)

Recreate the following screenshot using Bootstrap, HTML and CSS. Do not forget to validate your HTML and validate your CSS.

In-Class Exercise 2 screenshots

Downloads:

In-Class Exercise 3

Bootstrap Grid (2%)

Due week 5: October 4 (at the end of class)

Recreate the following screenshot using Bootstrap, HTML and CSS. Do not forget to validate your HTML and validate your CSS.

In-Class Exercise 3 screenshots

Downloads:

In-Class Exercise 4

Bootstrap Navigation (2%)

Due week 7: October 18 (at the end of class)

Recreate the following screenshot using Bootstrap, HTML and CSS. Do not forget to validate your HTML and validate your CSS.

In-Class Exercise 4 screenshots

Downloads:

In-Class Exercise 5

Bootstrap Carousel (2%)

Due week 8: October 25 (at the end of class)

Recreate the following screenshot using Bootstrap, HTML and CSS. Do not forget to validate your HTML and validate your CSS.

In-Class Exercise 5 screenshots

Downloads: