Index.html / glossary.html / contacr.html

</DeGenerate> · Jan 7, 2025

Please understand I have been coding for just a week so forgive my dumb question. These titles

(index.html / glossary.html / contact.html)

are inside one document but each one looks different, but the app only really focuses on one of them although they are all displayed. how would I learn to code them all differently or do I ignore 2 of them and just focus on the one ?

Thanks

Saul H. · Jan 7, 2025

Index.html functions as the index, and in a website, the page that navigates to other pages using hyperlinks. It is arguably the most vital part of a webpage. Because I am unfamiliar with the text editor you are using, I don't know how you would edit index.html ot any other page (presumably simply by clicking it). My process is starting with the index and then moving to other pages. Also, your web pages should not all have the same code.

In conclusion, here are the functions of your website pages:

Index.html:
Overview of your website and potentially hyperlinks to other pages.
Glossary.html:
Glossary of your website.
Contact.html:
Contact information for your website.

VBService · Jan 8, 2025

Do you not understand how to use a menu with links to other HTML documents?
Do you not know how the <a> element works?

BTW,
check out One Page websites, maybe it will interest or inspire you.
Example:

HTML:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home</title>

    <style>
      /* Smooth scrolling */
      html {
        scroll-behavior: smooth; /* Enables smooth scrolling when clicking on links */
      }
      /* Navigation styling */
      nav {
        position: fixed; /* Fixes the navigation bar to the top */
        top: 0; /* Aligns the navigation to the top of the screen */
        left: 0;
        width: 100%; /* Full width navigation */
        background-color: #333; /* Dark background for the navigation */
        z-index: 9999; /* Keeps the navigation on top of other content */
      }
      nav ul {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex; /* Displays the list items in a row */
        justify-content: center; /* Centers the list items horizontally */
      }
      nav ul li {
        margin: 0 15px; /* Adds space between the navigation items */
      }
      nav ul li a {
        color: white; /* White text color for the links */
        text-decoration: none; /* Removes underline from links */
        font-size: 18px; /* Sets font size for the links */
        padding: 10px 20px; /* Adds padding inside each link */
        display: block; /* Makes the entire area of the link clickable */
      }
      nav ul li a:hover {
        background-color: #555; /* Changes the background color when hovering over a link */
      }
      /* Main content section styling */
      main {
        padding-top: 50px; /* Adds space at the top so content doesn't get hidden under the navigation */
      }
      section {
        height: 100dvh;
        padding: 40px;
        margin-bottom: 20px;
        background-color: #f4f4f4; /* Light background color for the sections */
        border-radius: 8px; /* Rounded corners for sections */
        scroll-margin-top: 2rem; /* Adds a 2rem margin when scrolling to this section */
      }
      section h1 {
        margin-top: 0; /* Removes top margin for section titles */
      }
    </style>
  </head>
  <body>
    <nav>
      <ul>
        <li><a href="#home">Home</a></li> <!-- Link to the Home section -->
        <li><a href="#glossary">Glossary</a></li> <!-- Link to the Glossary section -->
        <li><a href="#contact">Contact</a></li> <!-- Link to the Contact section -->
        <li><a href="#browser">Browser</a></li> <!-- Link to the Browser section -->
      </ul>
    </nav>

    <main>
      <section id="home">
        <h1>Home</h1>
        <p>Content for Home page...</p>
      </section>

      <section id="glossary">
        <h1>Glossary</h1>
        <p>Content for Glossary...</p>
      </section>

      <section id="contact">
        <h1>Contact</h1>
        <p>Content for Contact...</p>
      </section>

      <section id="browser">
        <h1>Browser</h1>
        <p>Content for Browser...</p>
      </section>
    </main>
  </body>
</html>

Big problem I need to solve with some unix utils	1	Jun 19, 2022
Will creating a subdomain necessarily interfere with my main index.html?	9	Aug 23, 2011
Java Goldmine site: http://javagoldmine.by.ru/index.html	0	Jul 29, 2008
What should I do Before I give up programming?	6	Jan 14, 2023
I'm tempted to quit out of frustration	1	Aug 13, 2023
Hello all! Noob here with completely unrealistic ambitions. Happy to join the crew and get good enough to help others.	4	Aug 13, 2024
Question about my projects	3	Jul 23, 2021
Seeking co-founders for my company.	3	Sep 8, 2024

Index.html / glossary.html / contacr.html

</DeGenerate>

Saul H.

VBService

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads