用HTML/CSS做一个有关长沙的网站
时间: 2023-11-25 09:21:11 浏览: 38
好的,下面是一个简单的长沙旅游网站的HTML/CSS代码示例:
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head <meta charset="UTF-8">
<title>欢迎来到长沙</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 10px;
}
nav {
background-color: #f2f2f2;
padding: 10px;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
nav li {
display: inline-block;
margin-right: 10px;
}
nav a {
color: #333;
text-decoration: none;
padding: 5px;
}
nav a:hover {
background-color: #333;
color: #fff;
}
h1 {
margin: 20px 0;
}
main {
margin: 0 20px;
}
section {
border: 1px solid #ccc;
padding: 10px;
margin-bottom: 20px;
}
section h2 {
margin: 0;
font-size: 24px;
}
section p {
margin: 10px 0;
line-height: 1.5;
}
footer {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<header>
<h1>欢迎来到长沙</h1>
</header>
<nav>
<ul>
<li><a href="#">景点介绍</a></li>
<li><a href="#">美食推荐</a></li>
<li><a href="#">住宿信息</a></li>
<li><a href="#">交通指南</a></li>
</ul>
</nav>
<main>
<section>
<h2>岳麓山</h2>
<p>岳麓山是长沙的著名景点,有着悠久的历史和灿烂的文化。山上有许多名胜古迹,如岳麓书院、橘子洲头等。</p>
</section>
<section>
<h2>糖油粑粑</h2>
<p>糖油粑粑是长沙的传统美食,口感糯软香甜,非常受当地人的喜爱。</p>
</section>
<section>
<h2>橙岛酒店</h2>
<p>橙岛酒店是长沙市区内的一家高档酒店,提供豪华客房、会议室、餐饮等服务。</p>
</section>
<section>
<h2>地铁1号线</h2>
<p>长沙市区内的地铁1号线贯穿南北,沿线有许多著名景点和商业区,是出行的好选择。</p>
</section>
</main>
<footer>
<p>版权所有 © 2021 长沙旅游局</p>
</footer>
</body>
</html>
```
这个网站包括一个标题、一个导航栏、四个区块,每个区块都有一个标题和一段文本,以及一个页脚。通过CSS样式,我们设置了页面的布局、颜色和字体。您可以根据自己的需求进行修改和扩展,例如添加图片、表格、链接等。