HTML静态网页成品作业(HTML+CSS)—— 环保主题介绍网页(5个页面)

🎉不定期分享源码,关注不丢失哦

文章目录

  • 一、作品介绍
  • 二、作品演示
  • 三、代码目录
  • 四、网站代码
    • HTML部分代码
  • 五、源码获取


一、作品介绍

🏷️本套采用HTML+CSS,未使用Javacsript代码,共有5个页面

二、作品演示

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>垃圾分类</title>
	<link rel="stylesheet" href="./css/style.css">
</head>
<body>
	<div class="w1000">
		<div class="top">
			<img src="./images/1.jpg" alt="">
		</div>
		<div class="nav">
			<a href="index.html">首页</a>
			<a href="1.html">分类原则</a>
			<a href="2.html">垃圾种类</a>
			<a href="3.html">分类意义</a>
			<a href="4.html">宣传图片</a>
		</div>
		
		<div class="c">
			<div class="c-t">简介</div>
			<div class="c-d cl">
<img src="./images/2.jpg" class="fr" alt="">
				<p>垃圾分类(Garbage classification),一般是指按一定规定或标准将垃圾分类投放、收集、运输和处理,从而转变成公共资源的一系列活动的总称。垃圾分类的目的是提高垃圾的资源价值和经济价值,减少垃圾处理量和处理设备的使用,降低处理成本,减少土地资源的消耗,具有社会、经济、生态等几方面的效益。
</p>
			</div>
			<div class="c-t">产生原因</div>
			<div class="c-d cl">
<img src="./images/3.jpg" class="fl" alt="">
				<p class="fr">每个人每天都会扔出许多垃圾,在一些垃圾管理较好的地区,大部分垃圾会得到卫生填埋、焚烧、堆肥等无害化处理,而更多地方的垃圾则常常被简易堆放或填埋,导致臭气蔓延,并且污染土壤和地下水。垃圾无害化处理的费用是非常高的,根据处理方式的不同,处理一吨垃圾的费用约为一百元至几百元不等。人们大量地消耗资源,大规模生产,大量地消费,又大量地生产着垃圾。后果将不堪设想。
</p>
			</div>
		</div>
		
		<div class="footer">
			垃圾分类 从我做起
		</div>
	</div>
</body>
</html>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。
💙2.想要获取本文源码,点击前往吧

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/696731.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

MQ解决的问题

系统中MQ能解决哪些问题&#xff1f; 1.不同语言的程序使用MQ通信 2.分布式&#xff0c;微服务&#xff0c;之间的通信&#xff0c;实现服务质检解耦 3.高并发实现销峰作用 4.实现异步&#xff0c;提高用户体验。

“程序员职业素养全解析:技能、态度与价值观的融合“

文章目录 每日一句正能量前言专业精神专业精神的重要性技术执着追求的故事结论 沟通能力沟通能力的重要性团队合作意识实际工作中的沟通案例结论 持续学习持续学习的重要性学习方法进步经验结论 后记 每日一句正能量 梦不是为想象&#xff0c;而是让我们继续前往。 前言 在数字…

Python数据分析与机器学习在电子商务推荐系统中的应用

文章目录 &#x1f4d1;引言一、推荐系统的类型二、数据收集与预处理2.1 数据收集2.2 数据预处理 三、基于内容的推荐3.1 特征提取3.2 计算相似度3.3 推荐物品 四、协同过滤推荐4.1 基于用户的协同过滤4.2 基于物品的协同过滤 五、混合推荐与评估推荐系统5.1 结合推荐结果5.2 评…

docker 下载镜像发现超时,加速加速方法

报错原因有可能旧的不能用了&#xff01;&#xff01;&#xff01;换下面的&#xff01;&#xff01;&#xff01; cat /etc/docker/daemon.json "registry-mirrors": ["https://bhu1x6ya.mirror.aliyuncs.com"] 编辑完成后执行以下命令重启docker即可&a…

企业官网:过时了,但又没完全过时

作为一名互联网冲浪级选手&#xff0c;我经常会看到一些有趣的产品。 这两年比较让我感兴趣的产品有「飞聊」、「即刻」及其旗下的「橙 App」等等&#xff0c;然后我就想上它们的官网看看。 虽然现在 app 是主流&#xff0c;但我非常不喜欢下载 app&#xff0c;一是麻烦&…

基于STM32开发的智能空气质量监控系统

⬇帮大家整理了单片机的资料 包括stm32的项目合集【源码开发文档】 点击下方蓝字即可领取&#xff0c;感谢支持&#xff01;⬇ 点击领取更多嵌入式详细资料 问题讨论&#xff0c;stm32的资料领取可以私信&#xff01; 目录 引言环境准备智能空气质量监控系统基础代码实现&…

【吊打面试官系列-Mysql面试题】MySQL_fetch_array 和 MySQL_fetch_object 的区别是什么 ?

大家好&#xff0c;我是锋哥。今天分享关于 【MySQL_fetch_array 和 MySQL_fetch_object 的区别是什么 &#xff1f;】面试题&#xff0c;希望对大家有帮助&#xff1b; MySQL_fetch_array 和 MySQL_fetch_object 的区别是什么 &#xff1f; 以下是 MySQL_fetch_array 和 MySQL…

高考志愿填报的技巧和方法

高考过后&#xff0c;最让家长和学生需要重视的就是怎样填报志愿。高考完和出成绩之前有一段很长的时间&#xff0c;而成绩出来之后往往报考的时间非常的紧张。在很短的时间内&#xff0c;高考的学生和他的家长要综合高考的成绩&#xff0c;考虑院校&#xff0c;专业&#xff0…

【9】openssl 代码调试

0x01 前言 最近在学习密码学&#xff0c;但是国密算法(SM2&#xff0c;SM3,SM4,SM9)的细节都在openssl项目里&#xff0c;当然一些国际算法也在。想着看下代码执行过程和理论结合起来。中间走了一些弯路&#xff0c;做个笔记。 0x02 openssl安装 一开始认为是不是直接下载好的…

万向节锁死(Gimbal Lock)

Gimbal Lock是一个常见的3D动画问题,主要由旋转顺序引起的。我来详细解释一下它的成因: 在三维空间中,任何旋转都可以分解为绕X,Y,Z三个轴的欧拉旋转(Euler Rotation)。每个轴的旋转是按照一定顺序进行的,比如XYZ或ZYX等。 理论上,通过这三个旋转值的组合,可以达到任意的空间…

14. RTCP 协议

RTCP 协议概述 RTCP&#xff08;Real-time Transport Control Protocol 或 RTP Control Protocol 或简写 RTCP&#xff09;&#xff0c;实时传输控制协议&#xff0c;是实时传输协议&#xff08;RTP&#xff09;的一个姐妹协议。 注&#xff1a;RTP 协议和 RTP 控制协议&#…

Policy-Based Reinforcement Learning(1)

之前提到过Discount Return&#xff1a; Action-value Function &#xff1a; State-value Function: &#xff08;这里将action A积分掉&#xff09;这里如果策略函数很好&#xff0c;就会很大&#xff1b;反之策略函数不好&#xff0c;就会很小。 对于离散类型&#xff1a; …

QPS,平均时延和并发数

我们当前有两个服务A和B&#xff0c;想要知道哪个服务的性能更好&#xff0c;该用什么指标来衡量呢&#xff1f; 1. 单次请求时延 一种最简单的方法就是使用同一请求体同时请求两个服务&#xff0c;性能越好的服务时延越短&#xff0c;即 R T 返回结果的时刻 − 发送请求的…

error 12154 received logging on to the standby报错处理

错误 处理方法 该参数不是主库的servicename &#xff08;低级错误&#xff09; SQL> alter system set log_archive_dest_2 SERVICEstandby ASYNC VALID_FOR(ONLINE_LOGFILES,PRIMARY_ROLE) DB_UNIQUE_NAMEstandby; System altered. 观察主库日志: 备库日志: 该问题会影…

SpringBoot 配置事务

SpringBoot 在启动时已经加载了事务管理器&#xff0c;所以只需要在需要添加事务的方法/类上添加Transactional即可生效&#xff0c;无需额外配置。 TransactionAutoConfiguration 事务的自动配置类解析&#xff1a; SpringBoot 启动时加载/META-INF/spring/org.springframewor…

月薪6万,想离职...

大家好&#xff0c;我是无界生长&#xff0c;国内最大AI付费社群“AI破局俱乐部”初创合伙人。这是我的第 39 篇原创文章——《月薪6万&#xff0c;想离职...》 是的&#xff0c;你没有看错&#xff0c;我月薪6万&#xff0c;却想离职&#xff0c;很不可思议吧&#xff1f;周围…

matlab使用教程(95)—显示地理数据

下面的示例说明了多种表示地球地貌的方法。此示例中的数据取自美国商务部海洋及大气管理局 (NOAA) 国家地理数据中心&#xff0c;数据通告编号为 88-MGG-02。 1.关于地貌数据 数据文件 topo.mat 包含地貌数据。topo 是海拔数据&#xff0c;topomap1 是海拔的颜色图。 load t…

UART基本定义、三种编程方式、freertos内怎么用、怎么封装

文章目录 串口基本概念串口的三种编程方式uart编程查询方式不常用、其他两个方式用的多中断方式&#xff1a;代码原理 DMA方式&#xff1a;配置DMA原理代码 效率最高的UART编程方式&#xff1a;是什么&#xff1f;操作 在freertos里面调用uart应该怎么做&#xff1f;代码 面向对…

【PL理论】(16) 形式化语义:语义树 | <Φ, S> ⇒ M | 形式化语义 | 为什么需要形式化语义 | 事实:部分编程语言的设计者并不会形式化语义

&#x1f4ad; 写在前面&#xff1a;本章我们将继续探讨形式化语义&#xff0c;讲解语义树&#xff0c;然后我们将讨论“为什么需要形式化语义”&#xff0c;以及讲述一个比较有趣的事实&#xff08;大部分编程语言设计者其实并不会形式化语义的定义&#xff09;。 目录 0x00…

【EAI】生成可爱的贴纸

贴纸生成工具上线啦&#xff0c;目前支持贴纸生成、文生图功能。 地址&#xff1a;https://eai.coderbox.cn/ 功能&#xff1a; 贴纸生成 通过简单提示词&#xff0c;生成可爱的贴纸&#xff0c;支持4种像素规格文生图 基于开源模型实现&#xff0c;模型持续集成中作品库 生…