This is an old revision of the document!

02. [20p] Minor Design Changes

Time to add a second HTML page:

As expected, copy + paste your initial HTML with a new name, e.g.: second.html;
Link together the two .html pages (in each HTML page, find the <div class=“navbar-nav mr-auto”> element inside the #navbarToggle div and edit the hrefs to point to each-other);

Use relative paths, either pagename.html or ./pagename.html will do! DO NOT USE: absolute paths, e.g., C:\Users\…\pagename.html for obvious portability reasons!

Test by opening the HTML files in your browser. The user should be able to navigate between the two pages seamlessly!
One final touch: we want the menu to highlight (i.e., change foreground / background color and font style) the currently active menu button (different for each page)!

Hint for highlighting the current menu item: create a CSS class with your desired properties (e.g., active) and apply it to the appropiate menu element: <a class=“nav-item nav-link” …> element (also: different class attribute values are separated by space!).