Skip to content

Commit 575e8f7

Browse files
zhuang614zhuang614
authored
Update index.html
1 parent 8a5d687 commit 575e8f7

1 file changed

Lines changed: 114 additions & 23 deletions

File tree

‎index.html‎

Lines changed: 114 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -2,35 +2,126 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8">
5-
<title>Home - My Portfolio</title>
6-
<!-- Link to your CSS file -->
5+
<title>Zifeng Huang - My Portfolio</title>
76
<link rel="stylesheet" href="style.css">
8-
<!-- Link to Font Awesome for icons -->
7+
<!-- Font Awesome for icons -->
98
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
109
</head>
1110
<body>
12-
<!-- Main content wrapper -->
13-
<div class="content">
14-
<!-- Navigation Bar -->
15-
<nav class="navbar">
16-
<ul>
17-
<li><a href="index.html"><i class="fas fa-home"></i> Home</a></li>
18-
<li><a href="about.html"><i class="fas fa-user"></i> About</a></li>
19-
<li><a href="skills.html"><i class="fas fa-code"></i> Skills</a></li>
20-
<li><a href="projects.html"><i class="fas fa-folder-open"></i> Projects</a></li>
21-
<li><a href="contacts.html"><i class="fas fa-envelope"></i> Contacts</a></li>
22-
</ul>
23-
</nav>
24-
<!-- Hero Section -->
25-
<header class="hero">
26-
<h1>Welcome to My Portfolio</h1>
27-
<h2>Zifeng Huang</h2> <!-- Your name -->
28-
<p>Future Web Developer | Student | Tech Enthusiast | Computer and Cybersecurity Engineering Major</p>
29-
</header>
30-
</div>
11+
12+
<!-- Navigation Bar -->
13+
<nav class="navbar">
14+
<ul>
15+
<li><a href="#home"><i class="fas fa-home"></i> Home</a></li>
16+
<li><a href="#about"><i class="fas fa-user"></i> About</a></li>
17+
<li><a href="#education"><i class="fas fa-graduation-cap"></i> Education</a></li>
18+
<li><a href="#skills"><i class="fas fa-code"></i> Skills</a></li>
19+
<li><a href="#projects"><i class="fas fa-folder-open"></i> Projects</a></li>
20+
</ul>
21+
</nav>
22+
23+
<!-- Home Section -->
24+
<section id="home" class="hero">
25+
<h1>Welcome to My Portfolio</h1>
26+
<h2>Zifeng Huang</h2>
27+
<p>Future Web Developer | Student | Tech Enthusiast | Computer and Cybersecurity Engineering Major</p>
28+
</section>
29+
30+
<!-- About Section -->
31+
<section id="about" class="bio">
32+
<h2><i class="fas fa-user"></i> About Me</h2>
33+
<p>
34+
<i class="fas fa-info-circle"></i>
35+
Hi! My name is Zifeng Huang. I'm a student at Illinois Institute of Technology and currently pursuing a Bachelor's degree in Computer and Cybersecurity Engineering.
36+
I'm studying web development and building my skills one project at a time. I'm passionate about creating clean and simple websites that are easy to use and accessible to everyone.
37+
</p>
38+
<img src="img/me.png" class="profile-pic" alt="Profile Picture">
39+
</section>
40+
41+
<!-- Education Section -->
42+
<section id="education" class="education">
43+
<h2><i class="fas fa-graduation-cap"></i> Education</h2>
44+
<div class="edu-row">
45+
<!-- Illinois Institute of Technology box -->
46+
<div class="edu-box edu-box-iit">
47+
<i class="fas fa-university"></i>
48+
<strong> Illinois Institute of Technology</strong><br>
49+
<span><i class="fas fa-laptop-code"></i></span> Bachelor of Science in Computer and Cybersecurity Engineering<br>
50+
<span><i class="fas fa-calendar-alt"></i></span> Expected Graduation: 2027-2028
51+
</div>
52+
<!-- Global Career Acceleration box -->
53+
<div class="edu-box edu-box-gca">
54+
<i class="fas fa-certificate"></i>
55+
<strong> Global Career Acceleration</strong><br>
56+
<span><i class="fas fa-code"></i></span> Web Development Course using AI<br>
57+
<span><i class="fas fa-award"></i></span> Certificate Program
58+
</div>
59+
</div>
60+
</section>
61+
62+
<!-- Skills Section -->
63+
<section id="skills" class="skills">
64+
<h2><i class="fas fa-code"></i> My Skills</h2>
65+
<div class="skills-row">
66+
<!-- HTML -->
67+
<div class="skill-box skill-html">
68+
<i class="fab fa-html5"></i> HTML
69+
<div class="skill-desc"><i class="fas fa-globe"></i> Experience with HTML for building websites.</div>
70+
</div>
71+
<!-- CSS -->
72+
<div class="skill-box skill-css">
73+
<i class="fab fa-css3-alt"></i> CSS
74+
<div class="skill-desc"><i class="fas fa-paint-brush"></i> Experience with CSS for styling websites.</div>
75+
</div>
76+
<!-- Python -->
77+
<div class="skill-box skill-python">
78+
<i class="fab fa-python"></i> Python
79+
<div class="skill-desc"><i class="fas fa-terminal"></i> Experience with Python programming.</div>
80+
</div>
81+
<!-- Kali Linux -->
82+
<div class="skill-box skill-linux">
83+
<i class="fab fa-linux"></i> Kali Linux
84+
<div class="skill-desc"><i class="fas fa-shield-alt"></i> Some experience with using Kali Linux for cybersecurity practices.</div>
85+
</div>
86+
<!-- Java -->
87+
<div class="skill-box skill-java">
88+
<i class="fab fa-java"></i> JAVA
89+
<div class="skill-desc"><i class="fas fa-cogs"></i> Experience with Object-Oriented Programming in JAVA.</div>
90+
</div>
91+
<!-- JavaScript -->
92+
<div class="skill-box skill-js">
93+
<i class="fab fa-js"></i> JavaScript
94+
<div class="skill-desc"><i class="fas fa-lightbulb"></i> Currently Learning JavaScript.</div>
95+
</div>
96+
</div>
97+
</section>
98+
99+
<!-- Projects Section -->
100+
<section id="projects" class="projects">
101+
<h2><i class="fas fa-folder-open"></i> My Projects</h2>
102+
<p><i class="fas fa-tools"></i> Work in progress! I'll be adding my class projects here as I complete them.</p>
103+
<div class="coming-soon">
104+
<i class="fas fa-clock fa-7x"></i>
105+
<div class="coming-text">Coming Soon!</div>
106+
</div>
107+
</section>
108+
109+
<!-- Return to Top Button -->
110+
<a href="#home" class="top-button">Return to Top</a>
111+
31112
<!-- Footer -->
32113
<footer class="footer">
33-
&copy; 2025 Zifeng Huang. All rights reserved.
114+
<span>
115+
<i class="fas fa-envelope"></i> Email: zhuang61@hawk.iit.edu &nbsp;|&nbsp;
116+
<i class="fab fa-linkedin"></i> LinkedIn:
117+
<a href="https://www.linkedin.com/in/zhuang61/" target="_blank" class="white-link">zhuang61</a> &nbsp;|&nbsp;
118+
<i class="fab fa-github"></i> GitHub:
119+
<a href="https://github.com/zhuang614" target="_blank" class="white-link">zhuang614</a>
120+
</span>
121+
<span style="margin-left: 20px;">
122+
&copy; 2025 Zifeng Huang. All rights reserved.
123+
</span>
34124
</footer>
125+
35126
</body>
36127
</html>

0 commit comments

Comments
 (0)