Here's an example HTML document that uses various HTML elements and tags:
<!DOCTYPE html>
<html>
<head>
<title>Example HTML Document</title>
</head>
<body>
<!-- Header section -->
<header>
<h1>Welcome to My Website</h1>
<nav>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
</header>
<!-- Main content section -->
<main>
<section id="home">
<h2>Home Section</h2>
<p>This is the home section of my website.</p>
<button>Click me!</button>
</section>
<section id="about">
<h2>About Section</h2>
<p>This is the about section of my website.</p>
<img src="image.jpg" alt="An image on my website">
</section>
<section id="contact">
<h2>Contact Section</h2>
<p>This is the contact section of my website.</p>
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name"><br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Submit">
</form>
</section>
</main>
<!-- Footer section -->
<footer>
<p>© 2023 My Website</p>
</footer>
</body>
</html>
This example uses various HTML elements and tags, including:
- Structural elements: <!DOCTYPE html>, <html>, <head>, <body>
- Heading elements: <h1>, <h2>
- Navigation elements: <nav>, <ul>, <li>, <a>
- Sectioning elements: <header>, <main>, <section>, <footer>
- Text elements: <p>, <button>, <label>, <input>
- Image elements: <img>
- Form elements: <form>, <input>, <textarea>, <select>, <option>, <button>
- Table elements: (not used in this example)
- Semantic elements: <header>, <nav>, <main>, <section>, <article>, <aside>, <footer>
Note that this is not an exhaustive list of all HTML elements and tags, but it covers many of the common ones.
