Technical Documentation Page - Build a Technical Documentation Page

HTML-CSS
1

o far**

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="styles.css">
    </head>
    <body>
      <main id="main-doc">technical documentation
      <section class="main-section" id="first_topic">
        <header>First topic</header>
        <code></code>
        <p>First topic is about variables</p>
        <p>First topic is about alphabets</p>
         <li></li>
         <nav id="navbar">
           <header>header 1</header>
         <a class="nav-link" href="#main-section">First topic</a>
         </nav>
</section>
      <section class="main-section" id="second_topic">
        <header>second topic</header>
        <code></code>
      <p>second topic is about variable scope</p>
      <p>second topic is about variable global</p>
      <li></li>
      <nav id="navbar">
        <header>header 2</header>
      <a class="nav-link" href="second_topic">second topic</a>
      </nav>
      </section> 
      <section class="main-section" id="third_topic">
        <header>third topic</header>
        <code></code>
        <p>third topic is about alphabet scope</p>
        <p>third topic is about alphabet global</p>
         <li></li>
         <nav id="navbar">
           <header>header 3</header>
           <a class="nav-link" href="third_topic">third topic</a>
         </nav>
        </section> 
      <section class="main-section" id="fourth_topic">
        <header>fourth topic</header>
        <code></code>
        <p>fourth topic is about constants scope</p>
        <p>fourth topic is about datatype scope</p>
         <li></li>
         <nav id="navbar">
           <header>header 4</header>
         <a class="nav-link" href="fourth_topic">fourth topic</a>
         </nav>
        </section> 
      <section class="main-section" id="fifth_topic">
        <header>fifth topic</header>
        <code></code>
        <p>fifth topic is about if else statement</p>
        <p>fifth topic is about while statement</p>
         <li></li>
         <nav id="navbar">
           <header>header 5</header>
         <a class="nav-link" href="fifth_topic">fifth topic</a>
         </nav>
        </section>  
        </main>

    </body>
  </html>

/* file: styles.css */
@media query(max-width: 600px) {
body {
background-color: lightblue;
}
navbar
{
text-align: left;
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

2

hi there, what was your question?

3

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.