html网页制作地理世界
时间: 2023-12-19 17:06:12 浏览: 16
以下是制作地理世界网页的HTML代码示例:
```html
<!DOCTYPE html>
<html>
<head>
<title>地理世界</title>
<style>
/* 设置背景图片 */
body {
background-image: url("world-map.jpg");
background-size: cover;
}
/* 设置导航菜单样式 */
nav {
background-color: #333;
overflow: hidden;
}
nav a {
float: left;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
nav a:hover {
background-color: #ddd;
color: black;
}
/* 设置页脚样式 */
footer {
background-color: #333;
color: white;
text-align: center;
padding: 10px;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>
<!-- 导航菜单 -->
<nav>
<a href="#">首页</a>
<a href="#">亚洲</a>
<a href="#">欧洲</a>
<a href="#">非洲</a>
<a href="#">北美洲</a>
<a href="#">南美洲</a>
<a href="#">大洋洲</a>
</nav>
<!-- 页面内容 -->
<h1>欢迎来到地理世界</h1>
<p>这里是地理世界的首页,您可以通过导航菜单访问其他页面。</p>
<!-- 页脚 -->
<footer>
<p>版权所有 © 地理世界</p>
</footer>
</body>
</html>
```