html我的家乡网页作业
时间: 2023-12-27 10:04:48 浏览: 27
根据提供的引用内容,以下是一个简单的HTML我的家乡网页作业的示例:
```html
<!DOCTYPE html>
<html>
<head>
<title>我的家乡</title>
<style>
/* CSS样式 */
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
nav {
background-color: #666;
padding: 10px;
text-align: center;
}
nav a {
color: #fff;
text-decoration: none;
margin: 0 10px;
}
nav a:hover {
color: #ff0000;
}
section {
padding: 20px;
margin-bottom: 20px;
background-color: #fff;
}
footer {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
</style>
</head>
<body>
<header>
<h1>欢迎来到我的家乡</h1>
</header>
<nav>
<a href="index.html">首页</a>
<a href="history.html">家乡历史</a>
<a href="scenery.html">家乡美景</a>
<a href="celebrities.html">家乡名人</a>
<a href="food.html">家乡美食</a>
<a href="architecture.html">家乡建筑</a>
</nav>
<section>
<h2>首页</h2>
<p>这是我的家乡网页作业的首页内容。</p>
</section>
<section>
<h2>家乡历史</h2>
<p>这是我的家乡网页作业的家乡历史页面内容。</p>
</section>
<section>
<h2>家乡美景</h2>
<p>这是我的家乡网页作业的家乡美景页面内容。</p>
</section>
<section>
<h2>家乡名人</h2>
<p>这是我的家乡网页作业的家乡名人页面内容。</p>
</section>
<section>
<h2>家乡美食</h2>
<p>这是我的家乡网页作业的家乡美食页面内容。</p>
</section>
<section>
<h2>家乡建筑</h2>
<p>这是我的家乡网页作业的家乡建筑页面内容。</p>
</section>
<footer>
<p>版权所有 © 2021 我的家乡</p>
</footer>
</body>
</html>
```
这个示例中,使用了简单的DIV CSS布局,包括一个页眉(header)、导航栏(nav)、内容区域(section)和页脚(footer)。每个页面都有一个标题和相应的内容。你可以根据需要修改页面的样式和内容。