《通信软件开发与应用》课程结业报告
一、要求以及所选主题
二、作业最终效果展示
三、开发过程
1.选择模板的思考过程
2.头部设计
3.主页设计
主页1，garden1.html
主页2，garden2.html
主页3，garden3.html
4.其他内容部分设计
①风景欣赏详细展示
②留言交流板块
四、发现问题但并未解决
问题1 如何将做的网页托管到平台上
五、心得体会
一、要求以及所选主题
根据课程结业要求，选择A主题，即静态网站。可使用你喜欢的任何CSS框架如BootStrap、MDB、tailwind等，页面不少于5个，最后一个页面放置结业报告的超链接。网站需部署到你喜欢的托管服务器上如github等。
撰写结业报告，要求如下：
A. 题目为《通信软件开发与应用》课程结业报告；
B. 报告需阐述：做的什么、开发过程、遇到的问题、如何解决、哪些未解决、总结；
C. 该报告需表现为HTML格式，从你上面的网站中可访问到。
结合该要求，我选择的主题为西藏旅游网站。
二、作业最终效果展示
这次作业我主要分了4个主页的html文件，其中包括主页,西藏简介,旅游景点,风景欣赏,以及报告页面。共4个文件。下图为图片展示。
三、开发过程
1.选择模板的思考过程
因为自大学以来，于朋友多次谈及前往西藏一游，但天有不测风云，高中毕业至今，疫情的威胁依旧存在，所以这个心愿还未实现。所以借此机会，制作了西藏的风景收集及相关介绍的静态网页项目。因为我做的是一个比较简单的平台推荐网页，所以就选择了比较喜欢的MDB框架来进行设计。作为一个西藏旅游推荐网站，理所应当需要提供有关西藏的旅游信息，比如西藏的优美风景图片，西藏的地区简介，西藏的地图等。其中主要运用了4个HTML文件，用跳转链接将其联系起来。
2.头部设计
网页主页头部设计由导航条加上背景图组成。导航条可以快速锁定所需要的内容，是网页开发极其重要的内容。背景图明确网站主题。其中，导航条使用了一个< nav >标签，其内容包括三个部分，包括< a >超链接，来实现网页的快速跳转，按钮来实现点击，区块，用于放置各个导航超链接。
导航是便于浏览整个网页的很重要的部分，这部分的代码为
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/style.css" rel="stylesheet" />
<title>西藏旅游网</title>
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
</head>
<body onload="MM_preloadImages('images/d2.jpg')">
<embed src="music/music.mp3" width="0" height="0"></embed>
<div class="con">
<div class="head">
<div class="logo">
<h1>西藏旅游网</h1>
</div>
<div class="nav">
<ul>
<li><a href="index.html">首 页</a></li>
<li><a href="garden1.html">西藏简介</a></li>
<li><a href="garden2.html">旅游景点</a></li>
<li><a href="garden3.html">风景欣赏</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
效果图为
头部设计主要将网页推荐介绍的三个部分先行进行部分的介绍，并给出了跳转到三个页面的链接，方便用户进行大略的阅读后，对后续的了解更有兴趣。
3.主页设计
主页1，garden1.html
这部分的内容主要包括西藏的简介，对整个西藏地区一个详细的介绍。介绍资料主要来自知乎、百度百科等网站。
<body>
<div class="con">
<div class="head">
<div class="logo">
<h1>西藏旅游网</h1>
</div>
<div class="nav">
<ul>
<li><a href="index.html">首 页</a></li>
<li><a href="garden1.html">西藏简介</a></li>
<li><a href="garden2.html">旅游景点</a></li>
<li><a href="garden3.html">风景欣赏</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div class="banner">
<embed src="Flash/Flash.swf" width="980" height="300"></embed>
</div>
<div class="clear"></div>
<div class="main">
<h2><a href="#">西藏简介</a></h2>
<p><strong>简介概述</strong></p>
<p>西藏自治区（藏文：བོད་རང་སྐྱོང་ལྗོངས།，藏语拼音：Poi Ranggyong Jong，威利：Bod rang skyong ljongs），古称"蕃"，简称"藏"，首府拉萨，是中国五个少数民族自治区之一。 位于中国青藏高原西南部，地处北纬26°50′至36°53′，东经78°25′至99°06′之间。北邻新疆维吾尔自治区，东连四川省，东北紧靠青海省，东南连接云南省，南与缅甸、印度、不丹、尼泊尔等国家毗邻，西与克什米尔地区接壤，陆地国界线4000多公里，南北最宽900多公里，东西最长达2000多公里，是中国西南边陲的重要门户，无出海口。</p>
<p>全区面积120.223万平方公里，约占全国总面积的1/8，在全国各省、市、自治区中仅次于新疆。平均海拔在4000米以上，素有"世界屋脊"之称。 2012年末全区常住人口总数为308万人， 辖4个地级市、3个地区，4个市辖区、72个县。</p>
<div class="fr"><a href="#"><img src="images/xizang.jpg" width="380"/></a></div>
<p>西藏是中国神圣领土不可分割的一部分 ，中央政权始终对西藏行使着有效管辖。藏族人民是中华民族大家庭中的重要一员。西藏唐宋时期称为"吐蕃"，元明时期称为"乌斯藏"，清代称为"唐古特"、"图伯特"等。清朝康熙年间起称"西藏"至今。</p>
<p>西藏以其雄伟壮观、神奇瑰丽的自然风光闻名。它地域辽阔，地貌壮观、资源丰富。自古以来，这片土地上的人们创造了丰富灿烂的民族文化。</p>
<p><strong>名称沿袭</strong></p>
<p>汉语中的"西藏"（藏文为bodljong）一词是指中华人民共和国的西藏自治区（藏文为bodrangskyongljong），简称为西藏。西藏，以清朝中央正式定名得名。唐宋为吐蕃；元朝属宣政院；明朝称乌思藏，设都司等；清初称卫藏，卫即前藏，藏即后藏；后正式定名为西藏，为西藏得名的开始；清朝设西藏办事大臣；民国初西藏地方；中华人民共和国成立以后，1965年西藏自治区正式建立，西藏一词即成为西藏自治区的简称，单字简称为"藏"。</p>
<p><strong>历史沿革</strong></p>
<p></p>
<p>远古时期，形成了西藏古人氏族。从古人氏族逐渐演变成西藏的四大氏族：赛、穆、顿、东，在此基础的增加"惹"和"柱"两氏族，通称为"六大氏族"。</p>
<p>在西藏发掘的古代大量实物可以找到藏区人类如何发展的一些科学证据。考古学家在西藏考古时，发掘发现了旧石器时期和新石器时期的各种石器、陶器、骨器、装饰品，谷物种子，甚至古人头骨等大量卖物。从尼洋河岸发掘出的古人骨头，没有类人猿的原始特征，属于现代人，"尼池（林芝）人"的骨头是大约4000多年前，而新石器时期或者铁石并用时代的（人骨）。</p>
<p></p>
<p></p>
<p></p>
</div>
<div class="clear"></div>
<!------------End main------------>
<div class="foot">
<p>632007060330</p>
<p></p>
</div>
<div class="clear"></div>
</div>
</body>
</html>
主页2，garden2.html
本部分讲了西藏的各类旅游景点的介绍，比如布达拉宫、大昭寺、甘丹寺等等的景点介绍。
图片如下
<body>
<div class="con">
<div class="head">
<div class="logo">
<h1>西藏旅游网</h1>
</div>
<div class="nav">
<ul>
<li><a href="index.html">首 页</a></li>
<li><a href="garden1.html">西藏简介</a></li>
<li><a href="garden2.html">旅游景点</a></li>
<li><a href="garden3.html">风景欣赏</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div class="banner"><a href="#"><img src="images/d2.jpg" width="980"/></a></div>
<div class="clear"></div>
<div class="main">
<h2><a href="#">旅游景点</a></h2>
<p>西藏名胜古迹众多。全区有各级文物保护单位251处，其中，国家级重点文物保护单位27处，自治区级重点文物保护单位55处，地（市）、县级文物保护单位169处。</p>
<p><strong><a href="#">布达拉宫</a></strong></p>
<div class="fr p5"><a href="#"><img src="images/a2.jpg" width="280"/></a></div>
<p>布达拉宫（藏文：པོ་ཏ་ལ，藏语拼音：bo da la，威利：po ta la），坐落于于中国西藏自治区的首府拉萨市区西北玛布日山上，是世界上海拔最高，集宫殿、城堡和寺院于一体的宏伟建筑，也是西藏最庞大、最完整的古代宫堡建筑群。</p>
<p>布达拉宫依山垒砌，群楼重叠，殿宇嵯峨，气势雄伟，是藏式古建筑的杰出代表，中华民族古建筑的精华之作。主体建筑分为白宫和红宫两部分。宫殿高200余米，外观13层，内为9层。布达拉宫前辟有布达拉宫广场，是世界上海拔最高的城市广场。</p>
<p><strong><a href="#">大昭寺</a></strong></p>
<p>大昭寺，又名"祖拉康"、"觉康"（藏语意为佛殿），位于拉萨老城区中心，是一座藏传佛教寺院，始建于唐贞观二十一年（公元647年），是藏王松赞干布建造，拉萨之所以有"圣地"之誉， 与这座佛像有关。寺庙最初称"惹萨"，后来惹萨又成为这座城市的名称，并演化成当下的"拉萨"。大昭寺建成后，经过元、明、清历朝屡加修改扩建，才形成了现今的规模。</p>
<p>大昭寺已有1300多年的历史，在藏传佛教中拥有至高无上的地位。大昭寺是西藏现存最辉煌的吐蕃时期的建筑，也是西藏最早的土木结构建筑，并且开创了藏式平川式的寺庙市局规式。</p>
<p><strong><a href="#">甘丹寺</a></strong></p>
<p>甘丹寺，位于拉萨达孜县境内拉萨河南岸海拔3800米的旺波日山上。旺波日山犹如一头卧伏的巨象，驮载着布满山坳、规模庞大的建筑群，充分体现出传统藏传佛教寺院建筑因地制宜，寺庙傍山而立，群楼重叠，巍峨壮观。</p>
<p>该寺是黄教六大寺中地位最特殊的一座寺庙，它是由藏传佛教格鲁派的创始人宗喀巴于1409年亲自筹建的，可以说是格鲁教派的祖寺，清世宗曾赐名为永寿寺。</p>
<p></p>
<p><strong><a href="#">昌珠寺</a></strong></p>
<div class="fl p5"><a href="#"><img src="images/a2-2.jpg" width="250"/></a></div>
<p>昌珠寺位于山南雅砻河东岸的贡布日山南麓，距乃东县约二公里，属格鲁派寺院。建于松赞干布时期，据说文成公主曾在该寺驻足修行。寺中悬挂有一口铜钟。</p>
<p>昌珠寺系吐蕃时期第一批兴建的佛教寺庙之一，重要建筑有大门、"乃定学"、措钦大殿名"乃定当"，大殿主像是莲花生。措钦大殿东西长45米，南北宽29米，里边有天井天棚，经堂有柱64根，主要佛殿三间，形式与拉萨大昭寺差不多。殿内有12座佛堂。</p>
<p><strong><a href="#">拉加里王宫 </a></strong></p>
<p>拉加里王宫遗址位于西藏自治区曲松县城南侧，建于13世纪，是吐蕃王室外后裔家庭势力在历经萨迦和帕竹政权后保留下来的王权象征。现存建筑可分为早、中、，晚三期。早期建筑藏语称"扎西群宗"，始建于13世纪，现存最高为12米的宫墙残段和南、北大门；中期建筑藏语称"甘丹拉孜"，建于15世纪；为拉加里王宫遗址现存的主体建筑，由王宫、仓库、拉康（宫殿）、广场、马厩等组成，原为5层，现存3层。尚残存部分壁画；晚期建筑称"夏宫"，建于18世纪，现存部分为一基本完整的院式宫殿。</p>
<p></p>
<p></p>
<p></p>
<p><strong><a href="mailto:1361229622@qq.com">了解更多西藏旅游景点请联系我们的邮箱：1361229622@qq.com</a></strong></p>
</div>
<div class="clear"></div>
<!------------End main------------>
<div class="foot">
<p>632007060330</p>
<p></p>
</div>
<div class="clear"></div>
</div>
</body>
</html>
主页3，garden3.html
本部分主要为西藏景点风景的介绍展示
代码如下：
<body>
<div class="con">
<div class="head">
<div class="logo">
<h1>西藏旅游网</h1>
</div>
<div class="nav">
<ul>
<li><a href="index.html">首 页</a></li>
<li><a href="garden1.html">西藏简介</a></li>
<li><a href="garden2.html">旅游景点</a></li>
<li><a href="garden3.html">风景欣赏</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div class="banner"><a href="#"><img src="images/d3.jpg" width="980"/></a></div>
<div class="clear"></div>
<div class="main">
<h2><a href="#">风景欣赏</a></h2>
<div class="xinshang">
<ul>
<li><a href="fjxs_1.html"><img src="images/q1.jpg" /></a></li>
<li><a href="fjxs_2.html"><img src="images/q2.jpg" /></a></li>
<li><a href="fjxs_3.html"><img src="images/q3.jpg" /></a></li>
<li><a href="fjxs_4.html"><img src="images/q4.jpg" /></a></li>
<li><a href="fjxs_5.html"><img src="images/q5.jpg" /></a></li>
<li><a href="#"><img src="images/q6.jpg" /></a></li>
<li><a href="#"><img src="images/q7.jpg" /></a></li>
<li><a href="#"><img src="images/q8.jpg" /></a></li>
<li><a href="#"><img src="images/q9.jpg" /></a></li>
<li><a href="#"><img src="images/q10.jpg" /></a></li>
<li><a href="#"><img src="images/q11.jpg" /></a></li>
<li><a href="#"><img src="images/q12.jpg" /></a></li>
<li><a href="#"><img src="images/q13.jpg" /></a></li>
<li><a href="#"><img src="images/q14.jpg" /></a></li>
<li><a href="#"><img src="images/q15.jpg" /></a></li>
<li><a href="#"><img src="images/q16.jpg" /></a></li>
<li><a href="#"><img src="images/q17.jpg" /></a></li>
<li><a href="#"><img src="images/q18.jpg" /></a></li>
<li><a href="#"><img src="images/q19.jpg" /></a></li>
<li><a href="#"><img src="images/q20.jpg" /></a></li>
</ul>
<p><strong><a href="images/down.rar" target="_blank">更多西藏旅游图片下载..</a></strong></p>
</div>
<p></p>
<p></p>
</div>
<div class="clear"></div>
<!------------End main------------>
<div class="foot">
<p>632007060330 </p>
<p></p>
</div>
<div class="clear"></div>
</div>
</body>
</html>
4.其他内容部分设计
①风景欣赏详细展示
在风景欣赏的部分，再次通过链接，对每一张图片都可以进行点击浏览，进行更好的欣赏浏览。
<body>
<div class="con">
<div class="head">
<div class="logo">
<h1>西藏旅游网</h1>
</div>
<div class="nav">
<ul>
<li><a href="index.html">首 页</a></li>
<li><a href="garden1.html">西藏简介</a></li>
<li><a href="garden2.html">旅游景点</a></li>
<li><a href="garden3.html">风景欣赏</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div class="banner"><a href="#"><img src="images/d3.jpg" width="980"/></a></div>
<div class="clear"></div>
<div class="main">
<h2><a href="garden3.html">风景欣赏</a></h2>
<div class="xinshang">
<div class="xinshang_img"> <img src="images/q1.jpg" width="700" /> </div>
<div class="xinshang_des">
<h2><a href="garden3.html">西藏旅游风景欣赏</a></h2>
<p>在西藏发掘的古代大量实物可以找到藏区人类如何发展的一些科学证据。考古学家在西藏考古时，发掘发现了旧石器时期和新石器时期的各种石器、陶器、骨器、装饰品，谷物种子，甚至古人头骨等大量卖物。从尼洋河岸发掘出的古人骨头，没有类人猿的原始特征，属于现代人，"尼池（林芝）人"的骨头是大约4000多年前，而新石器时期或者铁石并用时代的（人骨）。</p>
<p></p>
<p></p>
<p></p>
<h3 class="fr"><a href="index.html">返回首页</a></h3>
</div>
</div>
</div>
<div class="clear"></div>
<!------------End main------------>
<div class="foot">
<p>632007060330</p>
<p></p>
</div>
<div class="clear"></div>
</div>
</body>
</html>
②留言交流板块
<body>
<div class="con">
<div class="head">
<div class="logo">
<h1>西藏旅游网</h1>
</div>
<div class="nav">
<ul>
<li><a href="index.html">首 页</a></li>
<li><a href="garden1.html">西藏简介</a></li>
<li><a href="garden2.html">旅游景点</a></li>
<li><a href="garden3.html">风景欣赏</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div class="banner"><a href="#"><img src="images/d4.jpg" width="980"/></a></div>
<div class="clear"></div>
<div class="main">
<h2><a href="#">留言交流</a></h2>
<div class="zhuce" >
<div class="zhuce_info">姓名：
<input value="你的名字" />
</div>
<div class="zhuce_info">电话：
<input value="你的手机" />
</div>
<div class="zhuce_info">邮箱：
<input value="888888888888@qq.com"/>
</div>
<div class="">留言：
<textarea class="ly_textarea" style="">你的留言内容...</textarea>
</div>
<div class="subout">
<div class="sub" ><a href="#">提交</a></div>
<div class="sub" ><a href="#">重置</a></div>
</div>
</div>
<p></p>
<p></p>
</div>
<div class="clear"></div>
<!------------End main------------>
<div class="foot">
<p>632007060330</p>
<p></p>
</div>
<div class="clear"></div>
</div>
</body>
</html>
四、发现问题以及如何解决
问题、如何将做的网页托管到平台上
一开始在托管到github上时遇到了一些问题，最后解决方法如下：
一、创建一个新的githun账户
链接: github
二、点击此处创建一个新的项目
此处我已经创建完毕了。
四、因为我们已经在vs code上写好了代码，准备好了文件，所以直接进行上传文件
在上传代码时，需要先创建本地仓库，还需要链接ssh——key，此处困扰了我很久。
五、上传后提交
六、选择setting，并点击图片所画的部分
七、但最终还是没有部署上
五、心得体会
本次课程结业实验，是我第一次进行简单的网页设计，应用了比较简单的MDB框架，学习了HTML的各种标签，了解CSS进行页面的美化和调整。实践过程中，我掌握了许多有关网页前端和后端制作的知识，知道了静态网页和动态网页的区别，让我将爱好与网页设计结合到一起，更是收获良多，受益匪浅。但最终还是没能成功部署上服务器，只能在本地上浏览，感觉对github的使用还是存在很大的问题，对git的创建也不太了解，希望经过这个实践，能够在下次实践的时候，不出现这样的问题。
————————————————
版权声明：本文为CSDN博主「duhuahuaya」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/duhuahuaya/article/details/117753478
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
