HTML Web Pages
You create and work with four web pages, named index.html, page-1.html, page-2.html, and page-3.html.
All four pages are displayed with the default web browser styles. None are linked to CSS stylesheets.
NOTE: Please include your Name and Student ID in the title tag of each web page.




CSS Stylesheets
You create and work with four stylesheets, named global.css, style-1.css, style-2.css and style-3.css.
You link these CSS files to your four previously created web pages, and add various style properties and values to them.




Responsive Design
You make four web pages responsive to different screen sizes by adding negative spacing and media queries to their four linked stylesheet files.
These are the global.css, style-1.css, style-2.css, and style-3.css.




Working with Colours
You add text and background colours to the four stylesheet files you created previously.
These are the global.css, style-1.css, style-2.css, and style-3.css.




Classes and Custom Properties
You add classes to the page-3.html web page and the style-3.css stylesheet. You also add custom colour properties to style-3.css.

Return to Home.