I Need to Implement a Navigation Menu

HTML-CSS
1

Up 'til now I’ve been content to create a website without any navigation except scrolling down/up to find what I wanted. The time has come to end that and create a Home page menu that will take users to pages chosen.
I have the menu list created and have coded the HTML. I might have done it wrong. Please tell me if my approach is wrong.

I created HTML files (separate from my index.html) for each menu url to invoke. For example:

   <ul>
        <li>
          <a href="home">Home</a></li><br>
          <a href="Phyllis'Album.html">Phyllis' Album</a></li><br><br>
          <a href="personal-pages.html">Personal Pages</a></li><br><br>
          <a href="hutchins-line.html">Hutchins Surname Line</a></li><br><br>
          <a href="baker-line.html">Baker Surname Line</a></li><br><br>
          <a href="histories.html">Histories</a></li><br><br>
          <a href="anecdotes.html">Anecdotes</a></li><br><br>
          <a href="submissions.html">Submissions</a></li><br><br>
          <a href="search.html">Search</a></li><br><br>
          <a href="help.html     "Help></a></li><br><br>
     </ul>

When I click on the links, I’m taken to the pages (eg, Personal-Pages) and the coded content displays but there is no CSS styling. I have a separate file for all the CSS and I’ve linked to it. There was no problem before I started breaking the website up into separate pages. I don’t know how to phrase a search argument to find an article telling be how to fix this.

Suggestions will be greatly appreciated.

UPDATE:
When I created the individual HTML files, I did not think to add the standard components (DOCTYPE, etc.). It occurred to me that the HTML files each needed a link to the CSS styling file. I went back and added this . . .

<!DOCTYPE html>
<html lang="en-US">
<head>

	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <link type="text/css" 
        rel="stylesheet" href="CSS/clan.css" media="screen">

. . . to each HTML file. Now the pages display as styled.

I did NOT add any other code to those HTML files.

What should the HTML files for those pages contain in the way of regular markup?

IOW, what is the proper way to code HTML files that will be linked to within a website?

2

You can learn all about this here: https://www.freecodecamp.org/learn/full-stack-developer/

Highly recommended

3

the DOCTYPE, html head and body elements should be there in each html file

then each html file is linked to the css file

1 Like
4

Thank you, ILM. I made that change.