⛵ 源码获取文末联系 ✈

Web前端开发技术
描述网页设计题材，DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业 | 环境保护 | 保护地球 | 校园环保 | 垃圾分类 | 绿色家园 | 等网站的设计与制作HTML期末大学生网页设计作业

HTML：结构
CSS：样式
在操作方面上运用了html5和css3，
采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识
JavaScript：做与用户的交互行为

文章目录

前端学习路线
网页基本结构
网页演示
- HTML结构代码
学的反而越迷茫
学习更多

前端学习路线

（1）html文件：其中index.html是首页、其他html为二级页面；
（2）css文件：css全部页面样式,文字滚动, 图片放大等；
（3）js文件：js实现动态轮播特效, 表单提交, 点击事件等等（网页中运用到js代码）

网页基本结构

(1)首页：进入网页中看到的第一个页面(LOGO、公司名称、导航、banner、新闻、相关信息、底部信息、banner一般是5个　　
(2)二级页面：从首页点击进入之后的页面叫做二级页面
(3)三级页面：从二级页面点击进入的页面

网页html：网页是构成网站的基本元素，是承载各种网站应用的平台。通俗地说，网站就是由网页组成的
首页网站：首页是一个网站的入口网页，故往往会被编辑得易于了解该网站多数作为首页的文件名是index加上扩展名
导航菜单：是指位于页面顶部或者侧边区域的，也称之为导航栏，它起着链接站点或者软件内的各个页面的作用.
网页页脚：是网页中每个页面的底部的区域。常用于显示附加信息。如作者、备案号等。

网页演示

HTML结构代码

<!DOCTYPE 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="content12">
<div class="daohang"><ul><li class="active"><a href="index.html">首页</a>
</li><li ><a href="jieshao.html">介绍</a></li><li ><a href="zhuyaoneirong.html">主要内容</a></li><li ><a href="huanbaomingyan.html">环保名言</a></li></ul>
</div>
</div>
<div class="clear"></div><div  class="content12">
<div class="guanggaotupian"><div class="img">
<img src="data:images/1.jpg"></div></div>
</div>
<div class="clear"></div><div  class="content12">
<div class="taitou"><div class="title">
<div class="line"></div><div class="stitle"><div class="sstitle"><div class="h2">主要内容</div><span>ZHUYAONEIRONG</span></div></div>
</div></div>
<div class="zynr"><ul>
<li><div class="img"><img src="data:images/2.jpg"></div>
<div class="text">
<div class="title">防止污染</div>
<div class="clear"></div>
<div class="desc">防止由生产和生活活动引起的环境污染、化学污染，包括防治工业生产排放的废水、废气、废渣、粉尘、放射性物质以及产生的噪声、振动、恶臭和电磁微波辐射，交通运输活动产生的有害气体、液体、噪声，海上船舶运输排出的污染物，工农业生产和人民生活使用的有毒有害化学品，城镇生活排放的烟尘、污水和垃圾等造成的污染。</div>
</div>
</li>
<li><div class="img"><img src="data:images/3.jpg"></div>
<div class="text">
<div class="title">防止破坏</div>
<div class="clear"></div>
<div class="desc">防止由建设和开发活动引起的环境破坏，包括防止由大型水利工程、公路干线、大型港口码头、机场和大型工业项目等工程建设对环境造成的污染和破坏，农垦和围湖造田活动、海上油田、海岸带和沼泽地的开发、森林和矿产资源的开发对环境的破坏和影响，新工业区、新城镇的设置和建设等对环境的破坏和污染。</div>
</div>
</li></ul></div>
</div>
<div class="clear"></div><div  class="content12">
<div class="taitou"><div class="title">
<div class="line"></div><div class="stitle"><div class="sstitle"><div class="h2">环保名言</div><span>HUANBAOMINGYAN</span></div></div>
</div></div>
<div class="hbmy"><div class="list">
<img src="data:images/4.jpg" class="img">
<img src="data:images/5.jpg" class="img"></div><div class="desc">
<br><br>手下留情，足下留青，爱护环境，人人有责。<br><br>植树造林，功在千秋。<br><br>爱祖国，护绿化，保清洁，爱家园。<br><br>保持地球生态平衡，就是保护人类自身。<br><br>人人为环保，环保为人人。<br><br>人人关心环境质量，人人参与环境保护。<br><br>珍惜资源，永续利用。<br><br>保护环境光荣，污染环境可耻。<br><br>依靠科技进步，促进环境保护。<br><br>提高环境意识，保护美好家园。</div></div>
</div>
<div class="clear"></div><div  class="content12">
<div class="taitou"><div class="title">
<div class="line"></div><div class="stitle"><div class="sstitle"><div class="h2">介绍</div><span>JIESHAO</span></div></div>
</div></div>
<div class="js"><div class="text"><div class="list">
<img src="data:images/6.jpg" class="img" ></div>环境保护就是指人类为解决现实或潜在的环境问题，协调人类与环境的关系，保障经济社会的持续发展而采取的各种行动的总称。<br><br>其方法和手段有工程技术、行政管理、也有法、经济、宣传教育……<br><br>保护环境是人类有意识地保护自然资源并使其得到合理的利用，防止自然环境受到污染和破坏；对受到污染和破坏的环境做好综合的治理，以创造出适合于人类生活、工作的环境，协调人与自然的关系，让人们做到与自然和谐相处的概念。
</div><div class="clear"></div><div class="slist">
<img src="data:images/7.jpg" class="simg" ></div></div>
</div>
<div class="clear"></div><div  class="content12">
<div class="dibu"><div class="desc">
保护环境
</div></div>
</div>
<div class="clear"></div></div></body></html>

学的反而越迷茫

有这种感觉很正常，因为你还没有真正去公司里面待过，也不清楚自己到底要学多少东西才能胜任公司里面给你分配的活。我从你的表述来看，你的基础应该还是很扎实的。跟着网上那种全套的视频教程学肯定没有问题。

当你以后真正进入公司，发现工作的难度和量大约只有你学习时期的大约20%，你可能就会发出一声叹息:原来工作也不过如此嘛。

这是很正常的，因为大部分公司是招你进去去干活的，写业务的，不是让你一个新人去研发公司架构的。都是现成的东西，你要做的就是在别人的教导下，手把手的指挥下去添砖加瓦。到时候你恐怕要惊呼:就这？

所以，放松心态吧，好好享受大学时光
—————————————————

学习更多

关注我 | 点赞博文 | 每天带你涨知识

大学生游戏静态HTML网页设计-环保保护环境主题相关推荐

大学生游戏静态HTML网页设计 (HTML+CSS+JS仿英雄联盟网站15页)
静态HTML网页设计作品——电影介绍(11页) 学生HTML个人网页作业作品下载
HTML5期末大作业:电影影视网站设计--电影介绍(11页) 学生HTML个人网页作业作品下载个人电影影视网页设计制作大学生个人静态HTML网页设计作品DIV布局加粗样式> 常见网页设计作 ...
HTML5期末大作业：电影在线网站设计——漫威电影(2页) 免费大学生网页设计制作作业作品下载dreamweaver制作静态html网页设计作业作
HTML5期末大作业:电影在线网站设计--漫威电影(2页) 免费大学生网页设计制作作业作品下载dreamweaver制作静态html网页设计作业作常见网页设计作业题材有个人. 美食. 公司. 学校 ...
HTML5期末大作业：淘宝网站设计——仿2021淘宝首页(1页) 大学生网页制作教程表格布局网页模板学生HTML静态水网页设计作业成品简单网页制作代码学生商城网页作品免费设计
HTML5期末大作业:淘宝网站设计--仿2021淘宝首页(1页) 大学生网页制作教程表格布局网页模板学生HTML静态水网页设计作业成品简单网页制作代码学生商城网页作品免费设计常见网页设计作业 ...
HTML5期末大作业：生活服务网站设计——生活服务同城商城(33页) 大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
HTML5期末大作业:生活服务网站设计--生活服务同城商城(33页) 大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载常见网页设计作业题材有个人 ...
HTML5期末大作业：仿英雄联盟网站设计——仿英雄联盟LOL首页(11页) 大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
HTML5期末大作业:仿英雄联盟网站设计--仿英雄联盟LOL首页(11页) 大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载常见网页设计作业题材有 ...
HTML+CSS静态页面网页设计作业——布偶猫(7页)带留言板大学生简单个人静态HTML网页设计作品 DIV布局动物网页模板代码 DW学生个人网站制作成品下载
HTML5期末大作业:布偶猫网站设计--布偶猫(7页)带留言板大学生简单个人静态HTML网页设计作品 DIV布局动物网页模板代码 DW学生个人网站制作成品下载常见网页设计作业题材有个人. 美食. ...
HTML5期末大作业：布偶猫网站设计——布偶猫(7页)带留言板大学生简单个人静态HTML网页设计作品 DIV布局动物网页模板代码 DW学生个人网站制作成品下载
HTML5期末大作业:布偶猫网站设计--布偶猫(7页)带留言板大学生简单个人静态HTML网页设计作品 DIV布局动物网页模板代码 DW学生个人网站制作成品下载常见网页设计作业题材有个人. 美食. ...
HTML5期末大作业：食品超市网站设计——食品超市-功能齐全(31页) 大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
HTML5期末大作业:食品超市网站设计--食品超市-功能齐全(31页) 大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载常见网页设计作业题材有个 ...

大学生游戏静态HTML网页设计-环保保护环境主题