个人简介html源代码
<!DOCTYPE html>
<html>
<head>
<title>个人简介</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
h1 {
margin: 0;
font-size: 36px;
}
main {
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
h2 {
font-size: 24px;
margin-top: 0;
}
p {
font-size: 18px;
line-height: 1.5;
margin-bottom: 20px;
}
ul {
margin: 0;
padding: 0;
list-style: none;
}
li {
margin-bottom: 10px;
}
li span {
font-weight: bold;
display: inline-block;
width: 100px;
}
img {
max-width: 100%;
height: auto;
margin-bottom: 20px;
}
</style>
</head>
<body>
<header>
<h1>个人简介</h1>
</header>
<main>
<img src="https://via.placeholder.com/400x400" alt="个人照片">
<h2>基本信息</h2>
<ul>
<li><span>姓名：</span>张三</li>
<li><span>性别：</span>男</li>
<li><span>年龄：</span>25岁</li>
<li><span>学历：</span>本科</li>
<li><span>专业：</span>计算机科学与技术</li>
<li><span>毕业院校：</span>XX大学</li>
</ul>
<h2>个人经历</h2>
<p>2015年-2019年，在XX大学就读计算机科学与技术专业，获得本科学位。</p>
<p>2019年-至今，在XX公司担任前端工程师，负责公司网站的开发和维护。</p>
<h2>联系方式</h2>
<ul>
<li><span>电话：</span>13812345678</li>
<li><span>邮箱：</span>zhangsan@example.com</li>
<li><span>地址：</span>北京市海淀区XX街道XX号</li>
</ul>
</main>
</body>
</html>
这是一个简单的个人简介页面的HTML源代码。该页面包括一个标题、一个头部、一个主体和一些基本的样式。头部包括一个标题，主体包括一个个人照片、基本信息、个人经历和联系方式。基本信息和联系方式使用了无序列表，每个列表项包括一个标签和一个值。个人经历使用了段落。该页面还包括一个背景颜色和一个阴影效果。
