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>
<html>
<head>
<meta charset="utf-8">
<link href="css/all.css" rel="stylesheet"  media="all" type="text/css" />
<title>香格里拉</title>
</head>
<body>
<div class="menu"><div class="main"><ul class="center"><li><a href="index.html">香格里拉简介</a></li><li><a href="jieshao.html">地理环境</a></li><li><a href="chihewanle.html">少数民族</a></li><li><a href="tupian.html">主要景点</a></li><li><a href="denglu.html">联系我们</a></li></ul></div>
</div><div class="main">
<!--   <div class="banner "><div class="top_img"><div class="focus" id="focus"><div id="focus_m" class="focus_m"><ul><li style="display:block"> <img src="data:images/banner1.jpg" width="100%" /> </li><li style="display:none"> <img src="data:images/banner2.jpg" width="100%" /> </li><li style="display:none"> <img src="data:images/banner3.jpg" width="100%" /> </li></ul></div><a href="javascript:;" class="focus_l" id="focus_l" title="上一张"><b></b><span></span></a> <a href="javascript:;" class="focus_r" id="focus_r" title="下一张"><b></b><span></span></a> </div></div></div> --><script type="text/javascript" src="js/js.js"></script><div class="content"><div class="bar"><h3>旅游风光</h3></div><div class="scrollleft"><ul><li> <a href="tupian.html"><img src="data:images/0.jpg" width="100%" height="200"/> </a></li><li> <a href="tupian.html"><img src="data:images/1.webp" width="100%" height="200"/></a> </li><li> <a href="tupian.html"><img src="data:images/2.jpg" width="100%" height="200"/></a> </li><li> <a href="tupian.html"><img src="data:images/3.jpg" width="100%" height="200"/> </a></li><li> <a href="tupian.html"><img src="data:images/2.webp" width="100%" height="200"/> </a></li><li> <a href="tupian.html"><img src="data:images/3.webp" width="100%" height="200"/> </a></li><li> <a href="tupian.html"><img src="data:images/4.webp" width="100%" height="200"/> </a></li><li> <a href="tupian.html"><img src="data:images/7.jpg" width="100%" height="200"/> </a></li>
<div class="clear"></div></ul></div><div class="bar"><h3>香格里拉介绍</h3></div><div class=""> <img src="data:images/5.webp" width="500" class="fl" style="margin-right:11px" /><p>香格里拉原名中甸县，因与詹姆斯希尔顿的小说《消失的地平线》中描述的世外桃源极其相似而易名为香格里拉。在当地藏语中，香格里拉意为：心中的日月。香格里拉位于云南省西北部的滇、川、藏“大三角”区域，地处迪庆藏族自治州腹心地带，是一片世间少有的完美保留自然生态和民族传统文化的净土。就像《消失的地平线》里描述的一样：一个永恒、和平、宁静之地。这里有四面雪山环绕的草原，阳光灿烂，空气新鲜，有高深莫测的活佛，神圣静谧的湖水，金碧辉煌的寺庙和淳朴善良的康巴藏族。一切都如人们梦想中的伊甸园一般，据说生命在此可以得到永生……历史文化：香格里拉县原名中甸县。“香格里拉”之名源于藏经中的香巴拉王国，在藏传佛教的发展史上，其一直作为“净土”的最高境界而被广泛提及，在现代词汇中它又是“伊甸园、理想国、世外桃源、乌托邦”的代名，“香格里拉”是藏语“香巴拉”的音译。1933年美国小说家詹姆斯·希尔顿（James Hilton）在其小说《消失的地平线》中描绘了一块永恒和平宁静的土地——香格里拉。这是一个有雪峰峡谷、神秘庙宇、被森林环绕着的宁静的湖泊、美丽的大草原及牛羊成群的世外桃源。从此香格里拉成为众多的旅行者争相寻找的目标，而中甸县以其绝美的景致和独特的风土人情成为“香格里拉”的候选者之一。2001年经国务院批准，中甸县正式更名为香格里拉县。   </div><div class="clear"></div><div class="scrollleft2" id="content"><ul><li> <a href="tupian.html"><img src="data:images/a0.jpg" width="100%" height="160"/> </a></li><li> <a href="tupian.html"><img src="data:images/a1.jpg" width="100%" height="160"/></a> </li><li> <a href="tupian.html"><img src="data:images/a2.jpg" width="100%" height="160"/></a> </li><li> <a href="tupian.html"><img src="data:images/a3.jpg" width="100%" height="160"/> </a></li><li> <a href="tupian.html"><img src="data:images/a4.jpg" width="100%" height="160"/> </a></li><li> <a href="tupian.html"><img src="data:images/a5.jpg" width="100%" height="160"/> </a></li><li> <a href="tupian.html"><img src="data:images/a6.jpg" width="100%" height="160"/> </a></li><li> <a href="tupian.html"><img src="data:images/a7.jpg" width="100%" height="160"/> </a></li></ul></div><div class="clear"></div></div><script type="text/javascript" src="js/scroll.js"></script>
</div>
<div class="end"><p>香格里拉 </p>
</div>
<audio  autoplay="autoplay" src="video/1_香格里拉 - 魏如萱.mp3">
</audio>
</body>
</html>

学的反而越迷茫

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

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

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

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

学习更多

关注我 | 点赞博文 | 每天带你涨知识
相关问题可以相互学习，可关注↓公Z号

基于Html+Css+javascript的网页制作（旅游主题）相关推荐

DIV布局京东商城购物网站(4页) 基于Html+Css+javascript的网页制作（购物主题）
HTML5期末大作业:京东商城网站设计--京东商城购物网站(4页) 基于Html+Css+javascript的网页制作(购物主题) 文章目录 HTML5期末大作业:京东商城网站设计--京东商城购物网 ...
HTML5期末考核大作业：基于Html+Css+javascript的网页制作（化妆品公司网站制作）
HTML5期末考核大作业：基于Html+Css+javascript的网页制作（化妆品公司网站制作）...
HTML网页期末作业：基于Html+Css+javascript的网页制作（化妆品企业官网设计20页）...
HTML网页期末作业：基于Html+Css+javascript的网页制作（化妆品企业官网设计20页）
HTML5期末大作业：动漫网站设计——火影忍者动漫(7页) HTML+CSS+JavaScript 漫画网页制作作业_电影网页设计...
HTML5期末大作业:动漫网站设计--火影忍者动漫(7页) HTML+CSS+JavaScript 漫画网页制作作业_电影网页设计- 常见网页设计作业题材有个人. 美食. 公司. 学校. 旅游. 电 ...
HTML5期末大作业：重庆火锅网站设计——代码质量好-重庆火锅(5页) HTML+CSS+JavaScript 大学生网页制作期末作业
HTML5期末大作业:重庆火锅网站设计--代码质量好-重庆火锅(5页) HTML+CSS+JavaScript 大学生网页制作期末作业常见网页设计作业题材有个人. 美食. 公司. 学校. 旅游. ...
html期末作业代码网页设计——云南民族文化(8页) HTML+CSS+JavaScript html网页制作期末大作业成品_网页设计期末作业
HTML5期末大作业:家乡文化网站设计--云南民族文化(8页) HTML+CSS+JavaScript html网页制作期末大作业成品_网页设计期末作业常见网页设计作业题材有个人. 美食. 公司. ...
学生DW静态网页设计——代码质量好-家乡广州 (5页) HTML+CSS+JavaScript web网页制作期末大作业
HTML5期末大作业:家乡广州网站设计--代码质量好-家乡广州 (5页) HTML+CSS+JavaScript web网页制作期末大作业常见网页设计作业题材有个人. 美食. 公司. 学校. 旅游 ...

基于Html+Css+javascript的网页制作（旅游主题）