-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
111 lines (97 loc) · 3.55 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mrutyunjay Lodhi - Portfolio</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<style>
body {
background-color: #333; /* Dark background color */
color: #fff; /* Text color */
font-family: "Papyrus", cursive; /* Set the entire font to "Papyrus" */
margin: 0; /* Remove default margin */
padding: 0; /* Remove default padding */
}
header, nav {
background-color: #444; /* Dark header and navigation background color */
padding: 10px;
}
header h1, header p {
margin: 0;
}
nav ul {
list-style-type: none;
padding: 0;
}
nav ul li {
display: inline;
margin-right: 20px;
}
section {
padding: 20px;
margin: 20px;
border: 1px solid #555;
background-color: rgba(0, 0, 0, 0.7); /* Slightly transparent dark background */
border-radius: 10px;
}
img {
width: 150px;
border: 2px solid white; /* Add a white border around the image */
}
/* New styles to position the image in the top right corner */
.top-right-image {
position: absolute;
top: 10px; /* Adjust the distance from the top */
right: 10px; /* Adjust the distance from the right */
}
/* Style the icon links */
.icon-link {
text-decoration: none;
color: inherit;
}
</style>
</head>
<body>
<header>
<h1>Mrutyunjay Lodhi</h1>
<p>Web Developer</p>
</header>
<nav>
<ul>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
<img src="img1.jpg" alt="Mrutyunjay Lodhi" class="top-right-image"> <!-- Image in the top-right corner -->
<section id="about">
<h2>About Me</h2>
<p>I'm Mrutyunjay Lodhi, a first-year Computer Science Engineering (CSE) student at IIIT Kalyani. I have a passion for creating efficient and elegant software solutions. In addition to my programming skills, I'm dedicated to continuous learning and staying updated with the latest industry trends. I'm excited to showcase my work and skills in this portfolio.
I know JAVA and C and learning more.....</p>
</section>
<section id="contact">
<h2>Contact Me</h2>
<p>If you would like to get in touch with me, feel free to contact me using the information below:</p>
<ul>
<li>
<a href="mailto:2004loadhi@gmail.com" class="icon-link">
<i class="fas fa-envelope"></i> Email
</a>
</li>
<li>
<a href="https://www.linkedin.com/in/mrutyunjay-lodhi-b48171210" class="icon-link">
<i class="fab fa-linkedin"></i> LinkedIn
</a>
</li>
<li>
<a href="https://github.com/MJ04-20" class="icon-link">
<i class="fab fa-github"></i> GitHub
</a>
</li>
</ul>
</section>
<footer>
<p>© 2023 Mrutyunjay Lodhi</p>
</footer>
</body>
</html>