/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>The web site of qing</title>
  <link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
  <header>
    <h1>Welcome to my Website!</h1>
    <nav>
      <ul>
        <li><a href="#about">About</a></li>
        <li><a href="#services">Services</a></li>
        <li><a href="#contact">Contact</a></li>
      </ul>
    </nav>
  </header>

  <main>
    <section id="about">
      <h2>About</h2>
      <p>This is a paragraph! Here's how you make a link: <a href="https://neocities.org">Neocities</a>.</p>
      <p>Here's how you can make <strong>bold</strong> and <em>italic</em> text.</p>
      <p>Here's how you can add an image:</p>
      <img src="neocities.png" alt="Neocities Logo">
    </section>

    <section id="services">
      <h2>Services</h2>
      <p>To learn more HTML/CSS, check out these <a href="https://neocities.org/tutorials">tutorials</a>!</p>
      <ul>
        <li>First thing</li>
        <li>Second thing</li>
        <li>Third thing</li>
      </ul>
    </section>

    <section id="contact">
      <h2>Contact</h2>
      <p>If you have any questions, feel free to contact me at <a href="mailto:your-email@example.com">your-email@example.com</a>.</p>
    </section>
  </main>

  <footer>
    <p>&copy; 2024 The web site of qing</p>
  </footer>
</body>
</html>