web网页设计实例作业 我的家乡- 达州(4页) HTML+CSS+JavaScript dreamweaver作业静态HTML网页设计模板

web网页设计实例作业 我的家乡- 达州(4页) HTML+CSS+JavaScript dreamweaver作业静态HTML网页设计模板HTML5期末大作业:家乡网站设计——我的家乡-达州(4页)HTML+CSS+JavaScriptdreamweaver作业静态HTML网页设计模板常见网页设计作业题材有个人、美食、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节日、戒烟、电影、摄影、文化、家乡、鲜花、礼品、汽车、其他等网页设计题目,A+水平作业,可满足大学生网页大作业网页设

大家好,又见面了,我是你们的朋友全栈君。

HTML5期末大作业:家乡网站设计——我的家乡- 达州(4页) HTML+CSS+JavaScript dreamweaver作业静态HTML网页设计模板

常见网页设计作业题材有 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 等网页设计题目, A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!

作品介绍

1.网页作品简介 :HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局。

2.网页作品编辑:作品下载后可使用任意HTML编辑软件(如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改网页)。

3.网页作品技术:Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等,视频、 音频元素 、Flash,同时设计了logo(源文件),基本期末作业所需的知识点全覆盖。

一、作品展示

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

二、文件目录

在这里插入图片描述

三、代码实现


<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
<title>走进达州 - 跟随我们了解达州</title>
<!-- Bootstrap -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="css/scenery.css" rel="stylesheet">
<link rel="shortcut icon" href="img/logo.png" >
<!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询(media queries)功能 -->
<!-- 警告:通过 file:// 协议(就是直接将 html 页面拖拽到浏览器中)访问页面时 Respond.js 不起作用 -->
<!--[if lt IE 9]> <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script> <![endif]-->
<style> @font-face{ 
 font-family: "中山行书百年纪念版"; src: url("fonts/中山行书百年纪念版.ttf"); } </style>
</head>
<body>
<!-- 导航栏 -->
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="navbar-header">
<a href="index.html" class="navbar-brand">走进达州</a>
</div>
<div class="navbar-collapse collapse" role="naviqation">
<ul class="nav navbar-nav">
<li><a href="index.html">首页</a></li>
<li class="active"><a href="scenery.html">美景</a></li>
<li><a href="food.html">美食</a></li>
<li><a href="humanity.html">人文</a></li>
</ul>
</div>
</div>
</nav>
<!-- 背景 -->
<div class="background"></div>
<!-- 内容 -->
<div class="body">
<div class="container">
<!-- 城市美景 -->
<div class="scenery">
<div class="scenery-header">
<h3>城市美景</h3>
</div>
<!-- 巴山大峡谷 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>巴山大峡谷</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p6.jpg" alt="img1">
<p>巴山大峡谷前身为四川百里峡,位于宣汉县境内,是国家AAA级旅游风景区。景区由百里峡、江口湖两部分组成,总面积为105平方千米,其中百里峡景区范围65平方千米,海拔452米至2148米,峡长140千米。这里有百兽聚会、仙女岩、观音洞、南天门、二龙飞瀑、老黄山、犀牛望月、一线天、盘龙洞、雄鸡鸣天十大景点,江口湖水域面积20平方千米,有云雾寨、鸡窝石、三斗峡、普光寺、黄石白鹤林等景点。百里峡景区历史悠久,有秦末汉初樊哙屯兵驻扎留下的将军坪、跑马梁、拴马石、大通险道及石栈道等遗址,有张献忠、白莲教留下的青龙寨、大寨子等遗址。</p>
</div>
</div>
<!-- 八台山 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>八台山</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p7.jpg" alt="img2">
<p>八台山风景名胜区地处万源市八台乡的东部,因地貌成层状梯级递降,有八层之多,故名八台山。主峰2348m,为川东第二高峰。八台山为大巴山石灰岩山地的一部分。区内景物多彩多样,融山景、峰景、崖景、生景、气景为一体,是达州市自然风景最吸引人的景区之一。八台山峰谷高差达1500一1700m。站在峰顶,脚下群山起伏,如波似涛,延绵千里。其西南部为白沙河支流,谷坡宽阔,其上发育相对高差达100m的石灰岩孤丘36座,参差错落,形似象棋的棋子,故称棋盘山,这是四川省独一无二的石灰岩丘陵群景观。</p>
</div>
</div>
<!-- 真佛山 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>真佛山</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p8.jpg" alt="img3">
<p>真佛山位于达州市达川区城南30余千米的七里峡山脉中段的福善乡境内,是国家AAAA级风景区。风景区主要由德化寺、玉佛寺、金刚寺、凌云寨等人文景观,以及胭脂湖、三仙石、海螺洞、莲花庵、云华山、刀脊梁等自然景观构成。与德化寺遥遥相对的一佛寺双塔,造型别致,工艺精湛,塔高21层,可谓全国之最。古庙、石塔、林海、秀峰、溶洞、湖水浑然一体。</p>
</div>
</div>
<!-- 賨人谷 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>賨人谷</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p9.jpg" alt="img4">
<p>賨人谷风景区地处达州市渠县城东26千米,以奇山、秀水、幽洞、丽峡、飞瀑、湖泊、涌泉、怪石、古栈、茂林著称,被誉为川东“小九寨”、国家AAAA级旅游区、省级风景名胜区、省级森林公园。景区内景观众多,汇洞景、石景、崖景、瀑景、气景、生景和人文景观为一体,并且有些景物独具特色。洞景主要集中在渠县龙潭乡老龙村境内,初步调查有大小溶洞60多个,呈现于地表的多为落水洞形式,一门一洞,洞洞有别,洞间又有小洞相通。溶洞群中,以老龙洞的规模最大、最奇。该洞高20m,宽约30m,长在1000m以上。</p>
</div>
</div>
<!-- 宣汉观音山森林公园 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>宣汉观音山森林公园</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p10.jpg" alt="img5">
<p>观音山森林公园位于四川盆地东北大巴山南麓,达州市宣汉县柏树镇,面积24488亩,最高海拔1058.6米。以低山丘陵地貌为主,为中亚热带湿润季风气候区。观音山森林公园不仅是生态旅游胜地,还具有历史价值和丰富的文化底蕴,观音山的神话传说,神龙宫的传奇故事,山顶的宝盖寺遗址,红军战场遗址和“白莲教”起义遗址见证着历史的痕迹。</p>
</div>
</div>
<!-- 雷音铺省级森林公园 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>雷音铺省级森林公园</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p11.jpg" alt="img6">
<p>雷音铺森林公园总面积800公顷,距达川区南城6千米处,雷音铺森林公园金刚寺旅游度假村,距达城20千米,位于达川区金刚,该度假村置身于参天古树之中,大清乾隆三年建造的名胜古刹,规模宏伟壮观。雷音铺森林公园经过几年的建设,初具规模,已向游客开放并能为游客提供会议、度假、餐饮、娱乐为一体的优质服务。</p>
</div>
</div>
<!-- 万源市大竹河风景区 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>万源市大竹河风景区</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p12.jpg" alt="img7">
<p>大竹河风景区位于万源市北50千米,面积49.6平方千米。区内四季景色各有千秋。两岸山峰千姿百态,有的峭壁千仞,直插云霄;有的似鳄鱼上山、神龟下海,活灵活现;天坑、地缝、间歇泉、溶洞等景观目不暇接,令人叹为观止。</p>
</div>
</div>
<!-- 一佛寺塔 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>一佛寺塔</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p13.jpg" alt="img8">
<p>一佛寺塔又名双石塔,位于达川区城东南40千米的景市乡一佛塔村,一佛寺建于清宣统元年,其建筑形式和殿堂布局与真佛山寺庙十分相仿,可惜该寺庙毁于“文革”,现仅存山门和石梯,山门高5米,两边门柱上石刻楹联,为“梵刹甚清幽孤月寒烟空色相,园多雅致万家烟火映禅登”。距寺约20米是一佛塔,塔为双石塔,建于清道光二十九年,六边形密檐式实心塔。其中1号塔高42.65米,底层边长3.6米,下为石砌素面台基,高0.23米,基座为须弥座,高0.47米,东边三面浮雕佛龛人物10余尊以及园林建筑图案。</p>
</div>
</div>
<!-- 列宁主义街 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>列宁主义街</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p14.jpg" alt="img9">
<p>列宁主义街位于距达州市达川区63千米的石桥镇西南角,由东向西一字排开的四座仿木结构的石牌坊,分别是清嘉庆、同治、光绪年间为旌表、诰封、节孝而建造的。石牌坊古朴隽秀,重檐斗拱蔚为壮观。每坊额端均镂雕“五龙捧圣”。其间或浮雕“八仙”,或圆雕“桃园结义”,或“三战吕布”,或“二十四孝”等历史故事。</p>
</div>
</div>
<!-- 渠县汉阙群 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>渠县汉阙群</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p15.jpg" alt="img10">
<p>渠县碑、阙较多,而且品位高,档次高,其中汉阙有6处。是全国最多的地方,阙上有的刻有朱雀、青龙,有的刻有人物,雕刻精美,造型精致,为他处少见。全国重点保文物护单位2处,省重点文物保护单位4处,其余为县文物保护单位。主要碑、阙有冯焕阙、沈府君阙、蒲家湾无铭阙、赵家村西无铭阙、赵家村东无铭阙、王家坪无铭阙、赵公神道碑等。</p>
</div>
</div>
<!-- 渠县文庙 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>渠县文庙</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p16.jpg" alt="img11">
<p>渠县文庙地处四川达州市渠县县城内,市级重点文物保护单位。现存的文庙是前后经历康熙、雍正、乾隆、嘉庆四个皇帝,改迁位置,费时118年之久才建成的。文庙大门雄伟壮观,朱红照壁,十分耀眼。正北面“宫墙万仞”四个遁劲有力的楷书鎏金大字,相传为康熙皇帝手书。宫墙两边大门悬匾,左有“圣域”、右有“贤关”,即圣贤所能至。桥护栏雕刻文房四宝、花鸟虫鱼、祥云怪兽等。中桥两头为精雕蟠龙,只有状元衣锦还乡才可过此桥,寓意金榜题名,独占鳌头。两旁的二桥,也只有功成名就的读书人,才够资格过一趟,称做“游泮”,且要举行一定仪式,即所谓“泮水生香”,始能走过。</p>
</div>
</div>
<!-- 红三十军政治部旧址 -->
<div class="scenery-body">
<div class="scenery-body-header">
<h4>红三十军政治部旧址</h4>
</div>
<div class="scenery-body-body">
<img class="img-responsive" src="img/p17.jpg" alt="img12">
<p>红三十军政治部旧址位于四川省达州市通川区梓桐乡,建筑面积约620平方米,现存房屋10间。此处原名“杜府草堂”,因建国前是梓桐乡伪团总杜光亭的庄园。该建筑始建于民国初年,后经逐年维修、遂成为一座具有川北农村特色的四合大院。红三十军政治部旧址在1982年7月由达县地区人民政府批准为县级文物保护单位,并拨款修建了旧址陈列馆,老一辈无产阶级革命家张爱萍同志题写了馆名。1996年6月,被命名为地级爱国主义教育基地。2001年5月22日被达州市人民政府公布为达州市首批重点文物保护单位。</p>
</div>
</div>
</div>
</div>
</div>
<!-- 底栏 -->
<footer class="footer">
<div class="container">
<div class="footerbar">
<div class="footerbar-header">
<p>跟随我们走进达州</p>
</div>
<div class="footerbar-body">
<span><a href="scenery.html">赏达州美景</a></span>
<span><a href="food.html">享达州美食</a></span>
<span><a href="humanity.html">读达州人文</a></span>
</div>
<div class="footerbar-footer">
<p>Copyright © 2020-2020 走进达州</p>
</div>
</div>
</div>
</div>
</footer>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery,所以必须放在前边) -->
<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
<script src="js/scenery.js"></script>
</body>
</html>

五、学习资料

web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
在这里插入图片描述


六、更多源码

HTML5期末考核大作业源码* 包含 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
在这里插入图片描述

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/161560.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(1)
blank

相关推荐

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号