Skip to content

A code exercise to practice highlighting the current page in website navigation.

Notifications You must be signed in to change notification settings

ltw-webdev-1/navigation-highlight

Repository files navigation

summary time deliverables
A code exercise to practice highlighting the current page in website navigation.
1.5 hours
4 HTML files, 1 CSS file, images

Navigation highlight

Overview

  • Fork this repository.
  • Create the index.html file to match the screenshots.
  • Make the 3 other HTML pages & highlight the current page on all of them.
  • The content for each page can be found inside the content.txt file.
  • Run it through Markbot and make sure it passes all the checks.

Details

  • Typefaces: Georgia, Sigmar One
  • Text sizes: 3rem, 1.875rem, 1.125rem, .75rem
  • Colours: #2f2d13, #cc1465, #ffe500, #b20953, #b2a212
  • Line height: 1.5
  • Paddings: .2em .5em .3em, 0 .75em, .75em
  • Margins: .3em
  • Corner radius: 4px

Goal

Visually match the images in the “screenshots” folder and create the interaction shown in the linked video.


Hand in

Drop this folder into your Markbot application. Make sure to fix all the errors. And submit for grades using Markbot.

About

A code exercise to practice highlighting the current page in website navigation.

Resources

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

 

Packages

No packages published