<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My First HTML5 Page</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
line-height: 1.6;
}
header, nav, main, footer {
padding: 20px;
margin: 10px;
}
header, footer {
background-color: #f4f4f4;
text-align: center;
}
nav {
background: #333;
}
nav a {
color: white;
padding: 10px;
text-decoration: none;
}
nav a:hover {
background: #555;
}
</style>
</head>
<body>
<header>
<h1>Welcome to My HTML5 Page</h1>
<p>A simple example of a modern webpage structure</p>
</header>
<nav>
<a href="#">Home</a>
<a href="#">About</a>
<a href="#">Contact</a>
</nav>
<main>
<article>
<h2>About HTML5</h2>
<p>HTML5 is the latest version of the HyperText Markup Language, designed to make web pages more semantic and interactive. It includes new elements like <code><header></code>, <code><article></code>, <code><footer></code>, and multimedia tags like <code><video></code> and <code><audio></code>.</p>
</article>
<section>
<h2>Features</h2>
<ul>
<li>Improved multimedia support</li>
<li>Semantic elements for better structure</li>
<li>Offline storage and APIs</li>
</ul>
</section>
</main>
<footer>
<p>© 2025 My HTML5 Website</p>
</footer>
</body>
</html>