个人主页网站html模板代码
时间: 2024-09-09 13:01:35 浏览: 56
个人主页网站的HTML模板代码是一种基础的网页设计代码,用于构建一个展示个人信息的网站界面。下面是一个简单的HTML模板代码示例,它包括了基本的网页结构、头部信息、导航栏、主要内容区域以及页脚。
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>个人主页</title>
<style>
/* 在这里添加CSS样式 */
body {
font-family: Arial, sans-serif;
}
.header, .footer {
background-color: #f1f1f1;
text-align: center;
padding: 10px;
}
.nav {
background-color: #333;
color: white;
padding: 10px;
}
.nav a {
color: white;
text-decoration: none;
padding: 0 15px;
}
.nav a:hover {
text-decoration: underline;
}
.main-content {
margin: 15px;
}
</style>
</head>
<body>
<div class="header">
<h1>欢迎来到我的个人主页</h1>
</div>
<div class="nav">
<a href="#">首页</a>
<a href="#">关于我</a>
<a href="#">项目经验</a>
<a href="#">联系方式</a>
</div>
<div class="main-content">
<h2>关于我</h2>
<p>这里可以放置个人信息,包括教育背景、工作经历、技能等。</p>
<h2>项目经验</h2>
<p>介绍你参与过的项目以及你的贡献。</p>
</div>
<div class="footer">
<p>版权所有 © 2023</p>
</div>
</body>
</html>
```
这个模板包含了以下几个部分:
- `<!DOCTYPE html>` 声明了文档类型和HTML版本。
- `<html>` 标签定义了整个页面的范围。
- `<head>` 部分包含了页面的元数据,如字符集声明、页面标题和内联样式。
- `<body>` 部分包含了页面的可见内容,包括头部、导航栏、主要内容区域和页脚。
请注意,上述代码只是一个基础模板,你可以根据个人需求添加更多的HTML元素和CSS样式来丰富页面内容和视觉效果。
阅读全文