HTML & CSS — Your First Website

Lesson 9: Styling your navbar

Platform

Duration

  • 1 lesson

Resources

Differentiation

Give ākonga the freedom to choose their own background colour for their navbar. A list of supported html colour names can be found here.

Extension

In this activity, we have combined tags and attributes to target specific parts of our website, like only list items within unordered lists that are part of the navbar <nav ul li>. Consider how the order of these attributes might change how our program understands our code.

Guide learners to move on to the next lessons of the Your First Website unit.

About Activity

The ninth of the Your First Website lesson series, continuing the introduction to basic HTML and CSS through building a website from scratch, one step at a time.

Learners will cover fundamental skills and tools for using HTML and CSS, and how to apply them in the Trinket programming platform. In this lesson, they will cover basic CSS skills to style their navbar, bringing a bit of creativity to their webpage and improving their webpage UX (user experience).

Activity Guide

Next >> Your First Website - Lesson 10