<meta charset="UTF-8">
图片来源于网络，如有侵权联系删除
<title>探索自然之美——静态网页展示</title>
<style>
body {
font-family: 'Arial', sans-serif;
margin: 0;
padding: 0;
background: #f4f4f4;
}
.container {
width: 80%;
margin: auto;
overflow: hidden;
}
header {
background: #333;
color: #fff;
padding-top: 30px;
min-height: 70px;
border-bottom: #0066cc 3px solid;
}
header a {
color: #fff;
text-decoration: none;
text-transform: uppercase;
font-size: 16px;
}
header ul {
padding: 0;
list-style: none;
}
header li {
display: inline;
padding: 0 20px 0 20px;
}
header #branding {
float: left;
}
header #branding h1 {
margin: 0;
}
header nav {
float: right;
margin-top: 10px;
}
图片来源于网络，如有侵权联系删除
header .highlight, header .current a {
color: #e8491d;
font-weight: bold;
}
header a:hover {
color: #ffffff;
font-weight: bold;
}
.banner {
background: url('banner.jpg') no-repeat center center/cover;
height: 400px;
text-align: center;
color: #fff;
font-size: 30px;
line-height: 400px;
}
.content section {
padding: 20px;
background: #fff;
margin-bottom: 20px;
}
.content h2 {
color: #333;
}
.content p {
text-align: justify;
}
footer {
background: #333;
color: #fff;
text-align: center;
padding: 10px;
position: relative;
bottom: 0;
width: 100%;
}
</style>
<div class="container">
<div id="branding">
<h1><span class="highlight">自然</span>之美</h1>
</div>
<nav>
<ul>
<li class="current"><a href="#home">首页</a></li>
图片来源于网络，如有侵权联系删除
<li><a href="#about">lt;/a></li>
<li><a href="#services">服务</a></li>
<li><a href="#contact">联系</a></li>
</ul>
</nav>
</div>
<section id="about">
<h2>关于我们</h2>
<p>
我们是一个致力于推广自然之美，倡导生态保护的非营利组织，我们的愿景是通过提供丰富多样的自然教育资源，提高公众对自然环境的认识和热爱，促进人与自然的和谐共生。
</p>
<p>
成立以来，我们已开展了多次自然教育活动，包括户外徒步、生态摄影、科普讲座等，吸引了众多热爱自然的志愿者和参与者，我们的团队由一群富有激情和责任感的环保人士组成，他们来自不同的领域，共同为保护地球家园贡献力量。
</p>
</section>
<section id="services">
<h2>我们的服务</h2>
<p>
我们提供以下服务：
</p>
<ul>
<li>自然教育：组织户外活动，教授自然知识，提高公众环保意识。</li>
<li>生态修复：参与植树造林、水源保护等生态修复项目。</li>
<li>科普宣传：通过线上线下渠道，传播环保知识，倡导绿色生活。</li>
<li>国际合作：与国际环保组织合作，共同应对全球环境问题。</li>
</ul>
</section>
<section id="contact">
<h2>联系我们</h2>
<p>
如有关于自然保护、环保教育等方面的需求，欢迎与我们联系，以下是我们的联系方式：
</p>
<address>
<strong>电子邮件：</strong> contact@naturebeauty.org<br>
<strong>电话：</strong> +86-123-4567890<br>
<strong>地址：</strong> 自然之美环保组织，XX省XX市XX区XX路XX号
</address>
</section>
以上是一个简单的静态网页源码，包含标题、导航、横幅、内容区和页脚，内容区包括关于我们、我们的服务和联系我们三个部分，每个部分都有详细的描述，这个网页旨在展示自然之美的理念和服务，同时也提供了一个联系方式，以便公众能够与组织取得联系。
标签： #生成静态页面网站源码
评论列表