用HTML写一个个人网页
时间: 2023-05-27 10:02:08 浏览: 94
<!DOCTYPE html>
<html>
<head>
<title>我的个人网页</title>
<meta charset="utf-8">
<style type="text/css">
body {
font-family: Arial, sans-serif;
background-color: #F5F5F5;
}
h1 {
color: #3366CC;
text-align: center;
margin-top: 50px;
}
img {
display: block;
margin: auto;
margin-top: 30px;
border-radius: 50%;
box-shadow: 5px 5px #888888;
}
p {
text-align: center;
margin-top: 20px;
font-size: 20px;
}
ul {
list-style-type: none;
margin-left: 0;
padding-left: 0;
text-align: center;
margin-top: 30px;
}
li {
display: inline-block;
margin-right: 20px;
}
a {
text-decoration: none;
color: #3366CC;
}
a:hover {
text-decoration: underline;
}
footer {
background-color: #3366CC;
color: #FFFFFF;
padding: 20px;
margin-top: 150px;
text-align: center;
}
</style>
</head>
<body>
<header>
<h1>欢迎来到我的个人网页</h1>
<img src="profile.jpg" alt="头像">
<p>大家好,我是小明,一名编程爱好者。</p>
</header>
<nav>
<ul>
<li><a href="#about">关于我</a></li>
<li><a href="#skills">技能</a></li>
<li><a href="#projects">项目</a></li>
<li><a href="#contact">联系我</a></li>
</ul>
</nav>
<main>
<section id="about">
<h2>关于我</h2>
<p>我是一名计算机科学专业的大学生,目前正在学习Web开发和人工智能方向的知识。我热爱技术,喜欢挑战,有良好的学习能力和团队合作能力。</p>
<p>除了编程,我的兴趣爱好还包括阅读、音乐和旅行。我喜欢读各种类型的书籍,音乐和旅行能使我放松和让我更加深入地了解不同的文化和风土人情。</p>
</section>
<section id="skills">
<h2>技能</h2>
<ul>
<li>熟练掌握HTML、CSS和JavaScript语言</li>
<li>了解jQuery、Bootstrap、Vue等前端框架</li>
<li>掌握Python、Java、C++等编程语言</li>
<li>熟悉Linux系统下的基本命令和使用</li>
<li>熟悉MySQL、MongoDB等数据库的使用</li>
</ul>
</section>
<section id="projects">
<h2>项目</h2>
<ul>
<li>一个基于Vue的前端界面</li>
<li>一个用Python实现的自动化脚本工具</li>
<li>一个基于Bootstrap的响应式网站</li>
</ul>
</section>
<section id="contact">
<h2>联系我</h2>
<p>感谢您对我的个人网页感兴趣,请通过以下方式与我联系:</p>
<ul>
<li>邮箱:<a href="mailto:xiaoming@example.com">xiaoming@example.com</a></li>
<li>微信:xiaoming123</li>
<li>电话:+86 12345678901</li>
</ul>
</section>
</main>
<footer>
<p>© 2021 小明</p>
</footer>
</body>
</html>