6个页面的HTML个人网页设计,
时间: 2024-06-09 10:07:54 浏览: 15
以下是一个简单的6个页面的HTML个人网页设计的示例:
第一页:主页
```html
<!DOCTYPE html>
<html>
<head>
<title>个人网页</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">主页</a></li>
<li><a href="about.html">关于我</a></li>
<li><a href="resume.html">简历</a></li>
<li><a href="portfolio.html">作品集</a></li>
<li><a href="contact.html">联系我</a></li>
</ul>
</nav>
</header>
<main>
<h1>欢迎来到我的个人网页</h1>
<p>在这里你可以了解我的个人信息,我的作品和我的联系方式。</p>
</main>
<footer>
<p>© 2021 我的名字. 版权所有。</p>
</footer>
</body>
</html>
```
第二页:关于我
```html
<!DOCTYPE html>
<html>
<head>
<title>关于我</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">主页</a></li>
<li><a href="about.html">关于我</a></li>
<li><a href="resume.html">简历</a></li>
<li><a href="portfolio.html">作品集</a></li>
<li><a href="contact.html">联系我</a></li>
</ul>
</nav>
</header>
<main>
<h1>关于我</h1>
<p>我是一个Web开发者,喜欢用代码创造美丽的网页。</p>
<p>我在大学学习计算机科学,并且在毕业后一直从事Web开发工作。</p>
</main>
<footer>
<p>© 2021 我的名字. 版权所有。</p>
</footer>
</body>
</html>
```
第三页:简历
```html
<!DOCTYPE html>
<html>
<head>
<title>简历</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">主页</a></li>
<li><a href="about.html">关于我</a></li>
<li><a href="resume.html">简历</a></li>
<li><a href="portfolio.html">作品集</a></li>
<li><a href="contact.html">联系我</a></li>
</ul>
</nav>
</header>
<main>
<h1>简历</h1>
<h2>教育经历</h2>
<ul>
<li>大学本科,计算机科学专业,2015-2019</li>
<li>研究生,软件工程专业,2019-2021</li>
</ul>
<h2>工作经历</h2>
<ul>
<li>Web开发工程师,公司名称,2019-2021</li>
<li>前端工程师,公司名称,2021-至今</li>
</ul>
<h2>技能</h2>
<ul>
<li>HTML/CSS/JavaScript</li>
<li>React</li>
<li>Node.js</li>
<li>MySQL</li>
</ul>
</main>
<footer>
<p>© 2021 我的名字. 版权所有。</p>
</footer>
</body>
</html>
```
第四页:作品集
```html
<!DOCTYPE html>
<html>
<head>
<title>作品集</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">主页</a></li>
<li><a href="about.html">关于我</a></li>
<li><a href="resume.html">简历</a></li>
<li><a href="portfolio.html">作品集</a></li>
<li><a href="contact.html">联系我</a></li>
</ul>
</nav>
</header>
<main>
<h1>作品集</h1>
<ul>
<li><a href="#">项目一</a></li>
<li><a href="#">项目二</a></li>
<li><a href="#">项目三</a></li>
<li><a href="#">项目四</a></li>
<li><a href="#">项目五</a></li>
<li><a href="#">项目六</a></li>
</ul>
</main>
<footer>
<p>© 2021 我的名字. 版权所有。</p>
</footer>
</body>
</html>
```
第五页:联系我
```html
<!DOCTYPE html>
<html>
<head>
<title>联系我</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">主页</a></li>
<li><a href="about.html">关于我</a></li>
<li><a href="resume.html">简历</a></li>
<li><a href="portfolio.html">作品集</a></li>
<li><a href="contact.html">联系我</a></li>
</ul>
</nav>
</header>
<main>
<h1>联系我</h1>
<p>如果你想要联系我,可以通过以下方式:</p>
<ul>
<li>电子邮件:myemail@example.com</li>
<li>电话:123-456-7890</li>
<li>地址:1234 Main Street, Anytown, USA</li>
</ul>
</main>
<footer>
<p>© 2021 我的名字. 版权所有。</p>
</footer>
</body>
</html>
```
第六页:404错误页面
```html
<!DOCTYPE html>
<html>
<head>
<title>页面未找到</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">主页</a></li>
<li><a href="about.html">关于我</a></li>
<li><a href="resume.html">简历</a></li>
<li><a href="portfolio.html">作品集</a></li>
<li><a href="contact.html">联系我</a></li>
</ul>
</nav>
</header>
<main>
<h1>页面未找到</h1>
<p>抱歉,您访问的页面不存在或已被删除。</p>
<p>请返回<a href="index.html">主页</a>继续浏览。</p>
</main>
<footer>
<p>© 2021 我的名字. 版权所有。</p>
</footer>
</body>
</html>
```
相关推荐
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)