Scribd
Upload
30 views4 pages

!DOCTYPE HTML

The document is an HTML portfolio resume template with sections for home, content, projects, skills, about, and contact information. It includes navigation links between the sections and styles the content with CSS.

Uploaded by

vijaykumarvijaykumar00001
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
30 views4 pages

!DOCTYPE HTML

The document is an HTML portfolio resume template with sections for home, content, projects, skills, about, and contact information. It includes navigation links between the sections and styles the content with CSS.

Uploaded by

vijaykumarvijaykumar00001
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 4

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portfolio Resume</title>
<link rel="stylesheet" href="styles.css"> <!-- Link to external CSS file -->
</head>
<body>

<!-- Top Bar -->


<div class="top-bar">
<h1 class="logo">MY PORTFOLIO</h1>
</div>

<header>
<div class="container">
<nav>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#content">Content</a></li>
<li><a href="#projects">Projects</a></li>
<li><a href="#skills">Skills</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
</div>
</header>

<main>
<section id="home" class="section">
<div class="container">
<h2>Welcome to My Portfolio</h2>
<p>Welcome to my vibrant portfolio website! Here, you'll find information
about me, my skills, projects I've worked on, and how to get in touch with me. Take
a look around and feel free to reach out if you have any questions or
inquiries.</p>
</div>
</section>

<section id="content" class="section">


<div class="container">
<h2>Content</h2>
* Education: Bachelor's in Computer Science, XYZ University</br>
<br>*Certifications: Certified Web Developer, Issuing Organization: XYZ
Certification Institute,</br>
<br>*Skills: Proficient in HTML, CSS, JavaScript, Python, Effective
Communication, Team Collaboration.</br>
<br>*Work Experience: Web Developer at ABC Tech (2019-present), Responsible for
front-end and back-end development of e-commerce website </br>
</div>
</section>

<section id="skills">
<div class="container">
<h2>Skills</h2>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
<li>Python</li>
<li>Web Design</li>
</ul>
</div>
</section>

<section id="contact">
<div class="container">
<h2>Contact</h2>
<p>You can reach me at:</p>
<ul>
<li>Email: [email protected]
<li>Phone: 7603917058</li>
<li>LinkedIn: <a href="[https://www.linkedin.com/in/vijaykumar-
elumalai-91663b255/]">[ VIJAY KUMAR]</a></li>
</ul>
</div>
</section>

<section id="about">
<div class="container">
<h2>About Me</h2>
<p>"I'm VIJAY KUMAR, a passionate WEB DESIGNER. I love creating new things
and learning, and I enjoy the feeling of acquiring knowledge."</p>
</div>
</section>
</main>

<footer>
<div class="container">
<p>&copy; 2024 My Personal Website. All rights reserved.</p>
</div>
</footer>

<!-- Login Section -->


<form class="login-form">
<div class="container">
<input type="text" placeholder="Username">
<input type="password" placeholder="Password">
<input type="submit" value="Login">
</div>
</form>

<script src="script.js"></script>
</body>
</html>

css
/* Set background color to black */
body {
background-color: #000;
color: #fff; /* White text color */
font-family: Arial, sans-serif; /* Use a common font */
margin: 0;
padding: 0;
}

/* Style for the top bar */


.top-bar {
background-color: #333; /* Dark grey background color */
padding: 10px;
text-align: center;
}

.top-bar .logo {
margin: 0;
font-size: 24px;
color: #fff;
}

/* Header navigation */
nav ul {
list-style-type: none;
margin: 0;
padding: 0;
}

nav ul li {
display: inline;
margin-right: 20px;
}

nav ul li a {
color: #fff;
text-decoration: none;
}

nav ul li a:hover {
text-decoration: underline;
}

/* Main content container */


.container {
width: 80%;
margin: 0 auto;
padding: 20px;
}

/* Style for section headings */


h2 {
color: #ff7f0e; /* Orange color */
}

/* Style for login form */


.login-form {
margin-top: 20px;
text-align: right;
}

.login-form input[type="text"],
.login-form input[type="password"] {
padding: 8px;
margin-right: 10px;
}

.login-form input[type="submit"] {
padding: 8px 20px;
background-color: #4CAF50; /* Green background color */
color: white;
border: none;
cursor: pointer;
}

/* Style for sections */


section {
margin-bottom: 40px;
}

/* Style for section headings */


h2 {
font-size: 28px;
margin-bottom: 10px;
}

/* Style for section content */


p {
font-size: 18px;
line-height: 1.5;
}

/* Style for list items */


ul {
list-style-type: none;
padding: 0;
}

ul li {
margin-bottom: 5px;
}

ul li a {
color: #ff7f0e;
text-decoration: none;
}

ul li a:hover {
text-decoration: underline;
}

You might also like