Examples for Students

This page has links to the example code that students have asked for in the course.

Some of these examples were inspired by other developers in the way that they use HTML and CSS to accomplish these or similar tasks.

Click on the links to see the example code in action.

Examples using absolute How to style buttons Fun CSS hover effect flipping a card Example using the HSL color model to change the color Shows how the CSS Rules order does matter. Example of a dropdown navigation This shows how different fonts look in font-size Example of a footer using grid and flex Form Example 1 Form Example 2 Form Example 3 This is to be used on your local computer. This allows you to play with grid placement. This is an example of all the input types for a form This shows you how to style the first letter of a sentence This shows various ways of using list How to use a graphic for the item identifier I took a poster and recreated as an HTML page How to recreate a mobile nav - one example Create a mobile nav with dropdown - one example How to have multiple image sliders on one web page Nav Menu positioning examples with Active page shown Nav Menu with the logo in the middle of the links Nav Menu positioning examples How to use a grid to create a nested grid layout How to do pricing table layouts Example of basic HTML Site Plan Example using svg images to change the colors using CSS This shows a Tab Grid with extra data Showing the difference of using the table tag vs grid vs flex layout Cool typography effects using CSS