含有五个页面的网页源代码
时间: 2023-10-19 07:32:56 浏览: 34
以下是一个含有五个页面的简单网站的源代码示例,您可以参考:
index.html
```
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<main>
<h1>Welcome to My Website</h1>
<p>This is the homepage of my website.</p>
</main>
<footer>
<p>© 2021 My Website</p>
</footer>
</body>
</html>
```
about.html
```
<!DOCTYPE html>
<html>
<head>
<title>About Us</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<main>
<h1>About Us</h1>
<p>We are a company that specializes in web design and development.</p>
</main>
<footer>
<p>© 2021 My Website</p>
</footer>
</body>
</html>
```
services.html
```
<!DOCTYPE html>
<html>
<head>
<title>Our Services</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<main>
<h1>Our Services</h1>
<ul>
<li>Web Design</li>
<li>Web Development</li>
<li>SEO</li>
<li>Social Media Marketing</li>
</ul>
</main>
<footer>
<p>© 2021 My Website</p>
</footer>
</body>
</html>
```
portfolio.html
```
<!DOCTYPE html>
<html>
<head>
<title>Our Portfolio</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<main>
<h1>Our Portfolio</h1>
<ul>
<li><a href="#">Project 1</a></li>
<li><a href="#">Project 2</a></li>
<li><a href="#">Project 3</a></li>
<li><a href="#">Project 4</a></li>
</ul>
</main>
<footer>
<p>© 2021 My Website</p>
</footer>
</body>
</html>
```
contact.html
```
<!DOCTYPE html>
<html>
<head>
<title>Contact Us</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<main>
<h1>Contact Us</h1>
<ul>
<li>Email: info@mywebsite.com</li>
<li>Phone: 555-555-5555</li>
<li>Address: 123 Main St., Anytown USA</li>
</ul>
</main>
<footer>
<p>© 2021 My Website</p>
</footer>
</body>
</html>
```
这个网站包含五个页面:首页、关于我们、服务、作品集和联系我们。每个页面都有相同的导航菜单和页脚。