header {
background-color: #333;
color: #fff;
padding: 1rem;
text-align: center;
}
nav {
display: flex;
justify-content: center;
background-color: #444;
padding: 1rem;
}
nav a {
color: white;
text-decoration: none;
margin: 0 15px;
font-weight: bold;
}
nav a:hover {
color: #ff9900;
}
section {
margin: 20px;
padding: 20px;
background: white;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
footer {
background-color: #333;
color: #fff;
padding: 1rem;
text-align: center;
}
</style>
<header>
<h1>Welcome to My Website</h1>
</header>
<nav>
<a href="#">Home</a>
<a href="#">About</a>
<a href="#">Projects</a>
<a href="#">Contact</a>
</nav>
<section>
<h2>About Me</h2>
<p>
Hello! I'm [Your Name], and this is my personal website. Here you'll find information about my projects,
skills, and how to contact me. This site is powered by GitHub Pages and is entirely free to use!
</p>
</section>
<section>
<h2>Projects</h2>
<ul>
<li>Project 1: Description of the first project</li>
<li>Project 2: Description of the second project</li>
<li>Project 3: Description of the third project</li>
</ul>
</section>
<section>
<h2>Contact Me</h2>
<p>
You can reach me at <a href="mailto:[email protected]">[email protected]</a>.
</p>
</section>
<footer>
<p>© 2024 My Website. All rights reserved.</p>
</footer>