-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
35ece78
commit 7439605
Showing
1 changed file
with
127 additions
and
6 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,9 +1,130 @@ | ||
<html> | ||
<h1> | ||
<title>Hello World Page</title> | ||
</h1> | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<title>Your Name - Professional Portfolio</title> | ||
<style> | ||
/* Basic styling for layout and aesthetics */ | ||
body { | ||
font-family: Arial, sans-serif; | ||
margin: 0; | ||
padding: 0; | ||
} | ||
header { | ||
background-color: #34495e; | ||
color: white; | ||
padding: 60px 0; | ||
text-align: center; | ||
} | ||
nav { | ||
background-color: #2c3e50; | ||
overflow: hidden; | ||
} | ||
nav a { | ||
float: left; | ||
display: block; | ||
color: #ecf0f1; | ||
text-align: center; | ||
padding: 14px 20px; | ||
text-decoration: none; | ||
} | ||
nav a:hover { | ||
background-color: #1abc9c; | ||
color: white; | ||
} | ||
section { | ||
padding: 40px 20px; | ||
} | ||
section:nth-child(even) { | ||
background-color: #ecf0f1; | ||
} | ||
h2 { | ||
color: #2c3e50; | ||
} | ||
footer { | ||
background-color: #34495e; | ||
color: white; | ||
text-align: center; | ||
padding: 20px 0; | ||
position: relative; | ||
bottom: 0; | ||
width: 100%; | ||
} | ||
/* Responsive design for mobile devices */ | ||
@media screen and (max-width: 600px) { | ||
nav a { | ||
float: none; | ||
width: 100%; | ||
} | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<h2>Hello, World!</h2> | ||
<p>Welcome</p> | ||
|
||
<!-- Header Section --> | ||
<header> | ||
<h1>Your Name</h1> | ||
<p>Your Professional Title or Tagline</p> | ||
</header> | ||
|
||
<!-- Navigation Menu --> | ||
<nav> | ||
<a href="#about">About</a> | ||
<a href="#experience">Experience</a> | ||
<a href="#projects">Projects</a> | ||
<a href="#contact">Contact</a> | ||
</nav> | ||
|
||
<!-- About Section --> | ||
<section id="about"> | ||
<h2>About Me</h2> | ||
<p>Write a brief introduction about yourself, your background, and your professional interests.</p> | ||
</section> | ||
|
||
<!-- Experience Section --> | ||
<section id="experience"> | ||
<h2>Experience</h2> | ||
<ul> | ||
<li> | ||
<h3>Job Title at Company</h3> | ||
<p><em>Year – Year</em></p> | ||
<p>Describe your role and responsibilities.</p> | ||
</li> | ||
<li> | ||
<h3>Another Job Title at Another Company</h3> | ||
<p><em>Year – Year</em></p> | ||
<p>Describe your role and achievements.</p> | ||
</li> | ||
</ul> | ||
</section> | ||
|
||
<!-- Projects Section --> | ||
<section id="projects"> | ||
<h2>Projects</h2> | ||
<ul> | ||
<li> | ||
<h3>Project Name</h3> | ||
<p>Provide a brief description of the project, your role, and the technologies used.</p> | ||
</li> | ||
<li> | ||
<h3>Another Project</h3> | ||
<p>Include details about another significant project you've worked on.</p> | ||
</li> | ||
</ul> | ||
</section> | ||
|
||
<!-- Contact Section --> | ||
<section id="contact"> | ||
<h2>Contact</h2> | ||
<p>Email: <a href="mailto:[email protected]">[email protected]</a></p> | ||
<p>LinkedIn: <a href="https://www.linkedin.com/in/yourprofile" target="_blank">Your LinkedIn Profile</a></p> | ||
<p>GitHub: <a href="https://github.com/yourusername" target="_blank">github.com/yourusername</a></p> | ||
</section> | ||
|
||
<!-- Footer --> | ||
<footer> | ||
© 2024 Your Name. All rights reserved. | ||
</footer> | ||
|
||
</body> | ||
</html> |