HTML+CSS+JS环境保护网页设计期末课程大作业 web前端开发技术 web课程设计网页规划与设计-CSDN博客

本文链接：https://blog.csdn.net/p305114466/article/details/126824516

📂文章目录

👨‍🎓网页题目
✍️网页描述
🌐网站效果
🔧 代码实现
- 🧱HTML结构代码
🎁更多干货

👨‍🎓网页题目

🌲环境保护、🌳 保护地球、🌴 校园环保、🌵垃圾分类、🚵🏼绿色家园、等网站的设计与制作。

✍️网页描述

⭐ 总结了一些学生网页制作的经验：一般的网页需要融入以下知识点：div+css布局、浮动、定位、高级css、表格、表单及验证、js轮播图、音频视频 Flash的应用、ul li、下拉导航栏、鼠标划过效果等知识点，网页的风格主题也很全面：如爱好、风景、校园、美食、动漫、游戏、咖啡、音乐、家乡、电影、名人、商城以及个人主页等主题，学生、新手可参考下方页面的布局和设计和HTML源码（有用点赞△）

🌐网站效果

在这里插入图片描述

🔧 代码实现

🧱HTML结构代码




<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/style.css" />

</head>
<body>
<div class="main" >

<div  class="w12">
<div class="daohang">




<div class="img"><img src="images/1.jpeg"></div>
 
<ul>
<li class="active"><a href="index.html">首页</a>

   
    <li ><a href="huanjingbaohu.html">环境保护</a>
      

	 </li>
    <li ><a href="fazhanqianjing.html">发展前景</a>
      

	 </li>
    <li ><a href="xinxinggainian.html">新型概念</a>
      

	 </li>
    <li ><a href="lishiyange.html">历史沿革</a>
      

	 </li>
    <li ><a href="fenxibaogao.html">分析报告</a>
      

	 </li>
    <li ><a href="zaochengyingxiang.html">造成影响</a>
      

	 </li>
    <li ><a href="juticuoshi.html">具体措施</a>
      

	 </li>
    <li ><a href="xiangguanjieri.html">相关节日</a>
      

	 </li>
    <li ><a href="xiangguanjigou.html">相关机构</a>
      

	 </li>
    <li ><a href="jiazhiyiyi.html">价值意义</a>
      

	 </li>
    <li ><a href="falvzhichi.html">法律支持</a>
      

	 </li>

</ul>





</div>
</div>
<div class="clear"></div>

<div  class="w12">
<div class="gg1">


<div class="img">
<img src="images/2.jpg"></div>
 

</div>
<div class="taitou">


<div class="title">环境保护</div>

</div>
</div>
<div class="clear"></div>

<div  class="w5">
<div class="gg">




<ul>
<li>
<div class="img"><img src="images/2.jpg"></div>
</li>
<li>
<div class="img"><img src="images/3.jpg"></div>
</li>
<li>
<div class="img"><img src="images/4.jpg"></div>
</li>
<li>
<div class="img"><img src="images/5.jpg"></div>
</li>
 
</ul>

</div>
</div>

<div  class="w7">
<div class="huanjingbaohu">








<div class="text">
<div class="desc">
<div class="clear"></div>
环境保护（environmental protection），简称环保，涉及的范围广、综合性强，它涉及自然科学和社会科学的许多领域等，还有其独特的研究对象。环境保护方式包括：采取行政、法律、经济、科学技术、民间自发环保组织等等，合理利用自然资源，防止环境的污染和破坏，以求自然环境同人文环境、经济环境共同平衡可持续发展，扩大有用资源的再生产，保证社会的发展。</div>
<div class="img"><img src="images/6.jpg"></div>

</div>
 










</div>
<div class="zaochengyingxiang">








<div class="text">
<div class="desc">
<div class="clear"></div>
环境成本又称环境降级成本，是指由于经济活动造成环境污染而使环境服务功能质量下降的代价。环境降级成本分为环境保护支出和环境退化成本，环境保护支出指为保护环境而实际支付的价值，环境退化成本指环境污染损失的价值和为保护环境应该支付的价值。自然环境主要提供生存空间和生态效能，具有长期、多次使用的特征，也类似于固定资产使用特征。</div>
<div class="img"><img src="images/7.jpg"></div>

</div>
 










</div>
</div>
<div class="clear"></div>

<div  class="w12">
<div class="tupianliebiao1">




<ul>
<li>
<div class="img"><img src="images/8.jpg"></div>
</li>
<li>
<div class="img"><img src="images/9.jpg"></div>
</li>
<li>
<div class="img"><img src="images/7.jpg"></div>
</li>
<li>
<div class="img"><img src="images/10.jpg"></div>
</li>
<li>
<div class="img"><img src="images/11.jpg"></div>
</li>
<li>
<div class="img"><img src="images/12.jpg"></div>
</li>
<li>
<div class="img"><img src="images/13.jpg"></div>
</li>
<li>
<div class="img"><img src="images/14.jpg"></div>
</li>
 
</ul>

</div>
</div>
<div class="clear"></div>

<div  class="w12">
<div class="dibu">

<div class="desc">
某某某版权所有 
</div>


</div>
</div>
<div class="clear"></div></div></body></html>