Organize Menu Items

The <li> tag is used to create each item in a list.

Copy
<ul class="nav-menu">
  <li><a class="nav-link" href="#about">About</a></li>
  <li><a class="nav-link" href="#interests">Hobbies</a></li>
  <li><a class="nav-link" href="#memory">Memories</a></li>
</ul>

Content in a list is organized using the <li> tag within list tags such as <ul> or <ol>.

Within the menu list, we structure the menu items.

Menu items are set up using the <li> tag.

Within each <li> menu item, we've set up links using the <a> tag.

The <a> tag is used for linking, allowing navigation to an external address or to another position on the same page.

Here, the goal is to navigate to different positions on the same page.

To navigate to a specific position within the page we're creating, input # in the href attribute, followed by the ID of the element you wish to navigate to.

Later in the code, we will create elements with IDs such as #about, #interests, and #memory and enable navigation to them.

#about will navigate to the About section, #interests will navigate to the Hobbies section, and #memory will navigate to the Memories section.