<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>fo安方party</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f9f9f9;
margin: 0;
padding: 0;
}
.container {
width: 80%;
margin: auto;
overflow: hidden;
}
header {
background: #f06;
color: #fff;
padding: 20px;
text-align: center;
}
nav {
background: #333;
color: #fff;
padding: 15px;
text-align: center;
}
nav a {
color: #fff;
text-decoration: none;
padding: 0 15px;
}
section {
background: #fff;
padding: 20px;
margin-top: 15px;
}
footer {
background: #333;
color: #eee;
text-align: center;
padding: 10px;
position: relative;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>
<header>
<h1>fo安方party</h1>
</header>
<nav>
<a href="#about">关于俺们</a>
<a href="#services">vip服务</a>
<a href="#contact">call俺们</a>
</nav>
<div class="container">
<section id="about">
<h2>关于我们</h2>
<p>欢迎来到party,我们致力于为您提供一个温馨浪漫的party环境。</p>
</section>
<section id="services">
<h2>我们的服务</h2>
<p>我们提供多种party套餐,包括浪漫晚餐、电影之夜和户外探险等。</p>
</section>
<section id="contact">
<h2>联系我们</h2>
<p>如果您有任何问题或需要帮助,请随时联系我们。</p>
</section>
</div>
<footer>
<p>© 2024 fo安方party. 版权所有</p>
</footer>
</body>
</html>
这个示例包含了以下元素:
<!DOCTYPE html>
: 声明文档类型和HTML版本。
<html>
: 根元素,包含整个HTML文档。
<head>
: 包含文档的元数据,如字符集、视口设置和标题。
<meta>
: 定义字符编码和视口设置。
<title>
: 定义网页标题。
<style>
: 内联CSS样式,用于设置网页的基本样式。
<body>
: 包含网页的所有内容。
<header>
: 定义文档的页眉区域。
<nav>
: 定义导航链接部分。
<section>
: 定义文档中的一个独立的区段。
<footer>
: 定义文档的页脚区域。
最后,保存文件时使用.html
扩展名。