青岛旅行网页毕设HTML 带报告讲解5个充实超链接页面 大学生网页 旅游网页
2024-06-21 00:23:27
页面栏目包括首页的整体概览、推荐风景、图库、在线视频、注册共计5个栏目，首页布局多样，有左中右三列布局，也有上下布局，将div盒子的嵌套与浮动充分应用，相关知识点包含：HTML+CSS、CSS过渡效果、JS轮播图、表单、视频、图文混排等，报告1600字介绍了设计与实现过程、各页面草图、重要功能介绍、总结等内容~
页面预览视频：
青岛旅行网页毕设HTML 带报告讲解5个充实超链接页面 大学生网页 旅游网页
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>青岛旅行-青岛欢迎你~</title>
<link href="css/banner.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet" />
<style type="text/css">
#father #main {/* 大框架设置尺寸 左右居中 */ height: 600px;width: 1000px;margin-top: 1px;margin-right: auto;margin-left: auto;background-color: #FFF;font-family: "微软雅黑";font-size: 12px;line-height: 28px;color: #333;
}
</style>
<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="js/banner.js" type="text/javascript"></script>
</head><body bgcolor="#f2f2f2">
<div id="father">
<div id="line1"></div>
<div id="top"><a href="index.html"><img src="data:images/title.jpg" width="1000" height="120"></a></div>
<div id="title"><div id="daohang" class="d_out" onmouseover="this.className='d_over'" onmouseout="this.className='d_out'"><a href="index.html">首 页</a></div><div id="daohang" class="d_out" onmouseover="this.className='d_over'" onmouseout="this.className='d_out'"><a href="scenery.html">推荐风景</a></div><div id="daohang" class="d_out" onmouseover="this.className='d_over'" onmouseout="this.className='d_out'"><a href="gallery.html">图库</a></div><div id="daohang" class="d_out" onmouseover="this.className='d_over'" onmouseout="this.className='d_out'"><a href="video.html">视频</a></div><div id="daohang" class="d_out" onmouseover="this.className='d_over'" onmouseout="this.className='d_out'"><a href="login.html">注册</a></div>
</div>
<div id="main"><div id="left"><div id="left-text"><table width="100%" border="0"><tr><td height="45" class="dabiaoti">推荐内容 </td></tr><tr><td class="axiaozi"><img src="data:images/arrow_01.gif" width="5" height="7"> <a href="#" class="black">青岛成为毕业旅行首选目的地 </a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">出行青岛注意事项 </a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">海鲜商贩却要“放暑假”</a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">最浪漫十大酒店 </a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">开启精品自驾之旅</a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">青岛西海岸新区</a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">为市民奉上旅游福利</a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">青岛旅游志愿者招募启动</a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">自助旅游实用手册</a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black">创新青岛人文旅游名片 </a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> 青岛市 <br> <span class="bxiaozi"><a href="#" class="black">大教堂</a> </span> <span class="bxiaozi"><a href="#" class="black">金沙滩</a></span> <a href="#" class="black1"><span class="bxiaozi">崂山</span></a><br><img src="data:images/arrow_01.gif" alt="" width="5" height="7"> <a href="#" class="black"> 青岛旅游必去十大景点 </a></td></tr></table></div></div><div id="central"><!-- 代码 开始 --><div id="banner1"><div class="slides"><ul class="slide-pic"><li class="cur"><a href="#"><img alt="" src="data:images/banner_1.jpg" /></a></li><li><a href="#"><img alt="" src="data:images/banner_2.jpg" /></a></li><li><a href="#"><img alt="" src="data:images/banner_3.jpg" /></a></li><li><a href="#"><img alt="" src="data:images/banner_4.jpg" /></a></li><li><a href="#"><img alt="" src="data:images/banner_5.jpg" /></a></li></ul><ul class="slide-li op"><li class="cur"></li><li></li><li></li><li></li><li></li></ul><ul class="slide-li slide-txt"><li class="cur"><a href="#"></a></li><li><a href="#"></a></li><li><a href="#"></a></li><li><a href="#"></a></li><li><a href="#"></a></li></ul></div></div><!-- 代码 结束 --><div id="text2"><table width="100%" border="0"><tr><td height="236" align="center"><table width="80%" border="0"><tr><td><span class="dabiaoti">"</span> 青岛的旅游主要分为人文和自然两类，其中免费开放式景点占了绝大部分。
老城区以人文风情游为主，沿海地区主打滨海风光游。著名的八大关、天主教堂、基督教堂、奥帆中心、五四广场、海洋世界、滨海步行道、崂山风景区、青岛啤酒城，以及更多星罗棋布的广场、公园、酒庄、博物馆、名人故居和海滩浴场点缀在半岛尽头，可以说青岛这座城市一年四季都有不同的旅游热点。
如果不准备去黄岛金沙滩和崂山这两个离青岛市区相对远的景点，只是浏览主要景点，至少也需要三天。</td></tr></table></td></tr></table>
</div></div><div id="left"><div id="left-text"><div id="m-245"><div id="a195"></div><div id="a196"></div></div>
<div id="m-249"><table width="100%" border="0"><tr><td height="36" class="dabiaoti">欢迎登陆</td></tr><tr><td height="51"><label for="textfield"></label><input name="textfield" type="text" id="textfield" value="用户名"></td></tr><tr><td height="53"><input name="textfield2" type="password" id="textfield2" value="......"></td></tr><tr><td height="37" align="left" bgcolor="#f8f8f8"><label for="select"></label><select name="jumpMenu" id="jumpMenu"onchange="MM_jumpMenu('parent',this,0)">
<option value="#">男</option>
<option value="#">女</option>
</select></td></tr><tr><td height="42" align="left"><input type="checkbox" name="checkbox" id="checkbox">
同意注册协议 <br></td></tr><tr><td align="center"><input name="button2" type="submit" class="wenben" id="button2" onclick="MM_popupMsg('注册成功，点击确定跳转至首页。');MM_goToURL('parent','index.html');return document.MM_returnValue" value="登录" /></td></tr></table></div></div></div></div><div id="peitu"><img src="data:images/peitu.jpg" width="1000" height="280"></div>
<div id="footer"><iframe src="footer.html" width="100%" height="300" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe></div>
</div></body>
</html>
青岛旅行网页毕设HTML 带报告讲解5个充实超链接页面 大学生网页 旅游网页相关推荐
- 超赞的动漫主题大学生网页html作业带报告 JS轮播图表单视频下拉菜单栏
动漫主题网页设计,制作精良.完成度较高,运用有js轮播图.下拉菜单栏.鼠标滑过效果.js正则表达式等,子页面运用图文混排不重复排版,另有制作报告1500字,描述了制作过程.方法.总结等.预览视频如下: ...
- php网页课程设报告,网页设计课程设计报告
<网页设计课程设计报告>由会员分享,可在线阅读,更多相关<网页设计课程设计报告(10页珍藏版)>请在人人文库网上搜索. 1.网页设计课程设计报告系别: 计算机科学系 班级: 0 ...
- HTML网页设计制作大作业(div+css) ~中华美德6页面带音乐 ~ 学生网页设计作业源码(中华文化)
HTML网页设计制作大作业(div+css) ~ 中华美德6页面带音乐 ~ 学生网页设计作业源码(中华文化) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从 ...
- 用HTML+CSS做一个漂亮简单的个人网页~个人相册介绍个人主页模板(6个页面) ~学生HTML个人网页作业作品~...
用HTML+CSS做一个漂亮简单的个人网页 ~ 个人相册介绍个人主页模板(6个页面) 学生HTML个人网页作业作品 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作 ...
- HTML期末大作业课程设计~仿阴阳师游戏官网首页html模板(HTML+CSS)~动漫主题html5网页模板-HTML期末作业课程设计期末大作业动漫主题html5网页模板-html5网页设计源码...
HTML期末大作业课程设计~仿阴阳师游戏官网首页html模板(DIV+CSS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的总数量太多?没 ...
- HTML期末大作业课程设计~仿阴阳师游戏官网首页html模板(HTML+CSS)~动漫主题html5网页模板-HTML期末作业课程设计期末大作业动漫主题html5网页模板-html5网页设计源码
HTML期末大作业课程设计~仿阴阳师游戏官网首页html模板(DIV+CSS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的总数量太多?没 ...
- web课程设计网页规划与设计—— 中西餐美食餐饮网站(10页面) html+css+javascript网页设计实例...
web课程设计网页规划与设计-- 中西餐美食餐饮网站HTML(10页面) html+css+javascript网页设计实例 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HT ...
- HTML5期末大作业：旅游网页设计——西安旅游9页(代码质量好) 学生DW网页设计作业源码 web课程设计网页规划与设计
HTML5期末大作业:网站--西安旅游9页(代码质量好) 学生DW网页设计作业源码 web课程设计网页规划与设计 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业 ...
- web前端期末大作业 ~我的家乡-绿城之都html+css+javascript旅游网页设计实例
web前端期末大作业 ~ 我的家乡-绿城之都html+css+javascript旅游网页设计实例 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页 ...
最新文章
- 舵机的脉冲指令的频率对于舵机运动影响
- 英国伯明翰大学首席教授姚新：人工智能研究应从三个问题重新考虑
- UML建模--序列图建模技巧
- TCP和UDP套接字编程
- Java 堆内存优化
- 持续集成实验个人总结
- 深度学习之卷积神经网络（5）表示学习
- vue key重复_【第2112期】 import { reactive } from #39;vue#39;
- latex 作者加小标_Latex 写期刊论文的小技巧
- oracle分组后伪列,Oracle伪列和伪表和分组函数（row_number，Rank）
- 学习编程技术常见的疑问，你敢说你没有过一个吗？信你个鬼！
- Nature子刊 | 通过多组学手段系统解析儿童肝母细胞瘤分子特征，为临床诊断提供精确参考...
- 新版WebStorm安装详细流程
- mysql 插入慢_Mongodb 与 MySQL对比
- Landsat8数据初识和概述
- 知识竞赛的环节主题文件准备的四大步骤及重要提示
- lucene-使用htmlparser解析有编码页面
- Win7安装.net 4.7.2
- 占空比可调的分频电路实现
- win10设置文件默认打开方式