.
个人网站主页模板
2024-09-16
4
创建一个个人网站主页模板是一个很好的方式来展示你的个人信息、作品集、博客文章或者任何你想要分享的内容。以下是一个简单的个人网站主页模板的基本结构和一些HTML/CSS代码示例，你可以根据自己的需要进行修改和扩展。
### HTML 结构
```html
我的个人网站
关于我
在这里介绍你自己，包括你的背景、技能和兴趣。
```
### CSS 样式 (`style.css`)
```css
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
line-height: 1.6;
}
header {
background: #333;
color: #fff;
padding: 1rem 0;
text-align: center;
}
header h1 {
margin: 0;
}
nav ul {
list-style: none;
padding: 0;
}
nav ul li {
display: inline;
margin: 0 10px;
}
nav ul li a {
color: white;
text-decoration: none;
}
main section {
margin: 2rem auto;
width: 80%;
text-align: center;
}
.project {
margin: 1rem 0;
padding: 1rem;
border: 1px solid #ccc;
border-radius: 5px;
}
footer {
text-align: center;
padding: 1rem 0;
background: #333;
color: white;
position: fixed;
bottom: 0;
width: 100%;
}
@media (max-width: 600px) {
nav ul li {
display: block;
margin: 10px 0;
}
}
```
这个模板提供了一个基本框架，包括头部、导航栏、主要内容区域（包含关于我、作品集、博客和联系方式等部分）以及页脚。你可以根据自己的设计需求添加CSS样式或JavaScript来增强网站的交互性和视觉效果。
免责声明：以上内容转自其它媒体，相关信息仅为传播更多信息，与本站立场无关。做网站，做小程序，模板小程序不保证该信息（包含但不限于文字、视频、音频、数据及图表）全部或者部分内容的准确性、真实性、完整性、有效性、及时性、原创性等，如有侵权请联系4000-277-886。