2020黑马旅游网项目素材及源码(无废话版)
2024-07-04 06:44:29
一、成品展示
二、素材下载
链接：https://pan.baidu.com/s/1HOmZt-Di53LHeNHR0fl3-g
提取码：eixh
三、代码
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>黑马旅游网</title>
</head>
<body><table width="100%" align="center"><!--1--><tr><td><img src="黑马旅游网_files/top_banner.jpg" width="100%"></td></tr><!--2--><!--搜索框及logo--><tr><table width="100%" align="center"><td><img src="黑马旅游网_files/logo.jpg" alt=""></td><td><img src="黑马旅游网_files/search.png" alt=""></td><td><img src="黑马旅游网_files/hotel_tel.png" alt=""></td></table></tr><!--3--><!--目录--><tr><td><table align="center" width="100%" cellspacing="0" cellpadding="0"><tr bgcolor="#bdb76b" align="center" height="45" ><td>首页</td><td>门票</td><td>酒店</td><td>香港车票</td><td>国内游</td><td>出境游</td><td>港澳游</td><td>抱团定制</td><td>全球自由行</td><td>收藏排行</td></tr></table></td></tr><!--4--><!--大图--><tr><td><table><tr><td><img src="黑马旅游网_files/banner_3.jpg"></td></tr></table></td></tr><!--5--><!--黑马精选横线--><tr><td><table width="100%" align="center"><tr><td><img src="黑马旅游网_files/icon_5.jpg">黑马精选<hr align="center" color="yellow" ></td></tr></table></td></tr><!--6--><!--黑马精选内容--><tr><td><table align="center" width="95%"><tr><td><img src="黑马旅游网_files/jiangxuan_1.jpg"><p><font>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</font></p></td><td><img src="黑马旅游网_files/jiangxuan_1.jpg"><p><font>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</font></p></td><td><img src="黑马旅游网_files/jiangxuan_1.jpg"><p><font>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</font></p></td><td><img src="黑马旅游网_files/jiangxuan_1.jpg"><p><font>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</font></p></td></tr></table></td></tr><!--7--><!--国内游的横线--><tr><table width="100%" align="center"><td><img src="黑马旅游网_files/icon_6.jpg">国内游<hr align="center" color="yellow" width="100%"></td></table></tr><!--8--><!--国内游的内容--><tr><td><table width="95%" align="center"><tr><td rowspan="2"><img src="黑马旅游网_files/guonei_1.jpg" height="100%"></td><td><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td><td><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td><td><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td></tr><tr><td><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td><td><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td><td><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td></tr></table></td></tr><!--9--><!--境外游的横线--><tr><td><table width="100%" align="center"><tr><td><img src="黑马旅游网_files/icon_7.jpg">境外游<hr color="yellow" align="center"></td></tr></table></td></tr><!--10--><!--境外游的内容--><tr><td><table width="95%" align="center"><tr><td rowspan="2"><img src="黑马旅游网_files/jiangwai_1.jpg" height="100%"></td><td><img src="黑马旅游网_files/jiangxuan_3.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td><td><img src="黑马旅游网_files/jiangxuan_3.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td><td><img src="黑马旅游网_files/jiangxuan_3.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td></tr><tr><td><img src="黑马旅游网_files/jiangxuan_3.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td><td><img src="黑马旅游网_files/jiangxuan_3.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td><td><img src="黑马旅游网_files/jiangxuan_3.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥ 699</font></td></tr></table></td></tr><!--11--><!--认证商标--><tr><td><table width="100%" align="center"><tr><td><img src="黑马旅游网_files/footer_service.png"></td></tr></table></td></tr><!--12--><!--页尾--><tr><td><table width="100%" align="center"><tr><td bgcolor="#d2691e" align="center" height="50"><font color="#696969" size="2">越来越牛的猿 版权所有Copyright 2006-2020, All Rights Reserved<a href="">京ICP备18021256号</a></font></td></tr></table></td></tr></table>
</body>
</html>
第二版用BootStrap完成
<!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>Bootstrap 101 Template</title><!-- Bootstrap --><link href="bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"><!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --><script src="bootstrap-3.3.7-dist/js/jquery-3.5.1.min.js"></script><!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 --><script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script><style>.paddtop{padding-top: 20px;}.search-input{float: left;width: 400px;height: 35px;border: 2px yellow solid;}.search-btn{width: 90px;}.handpick{border-bottom: 2px yellow solid;padding: 10px;}.company{height: 40px;background: yellow;text-align: center;line-height: 40px;border: yellow 2px solid;}</style>
</head>
<body><!--页眉--><div class="container-fluid"><div class="row"><img src="黑马旅游网_files/top_banner.jpg" class="img-responsive" width="100%"></div><div class="row"><div class="col-md-3"><img src="黑马旅游网_files/logo%20(1).jpg"></div><div class="col-md-5 paddtop"><input placeholder="请输入路线名称" class="search-input"><a href="#" class="btn btn-warning search-btn">搜索</a></div><div class="col-md-4"><img src="黑马旅游网_files/hotel_tel.png"></div></div><!--导航栏--><div class="row"><nav class="navbar navbar-default"><div class="container-fluid"><!-- Collect the nav links, forms, and other content for toggling --><div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><ul class="nav navbar-nav"><li><a href="#">传智播客<span class="sr-only">(current)</span></a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li></ul></div><!-- /.navbar-collapse --></div><!-- /.container-fluid --></nav></div><!--轮播图--><div class="row"><div id="carousel-example-generic" class="carousel slide" data-ride="carousel"><!-- Indicators --><ol class="carousel-indicators"><li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li><li data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="2"></li></ol><!-- Wrapper for slides --><div class="carousel-inner" role="listbox"><div class="item active"><img src="黑马旅游网_files/banner_1.jpg" width="100%" alt="..."><div class="carousel-caption">...</div></div><div class="item"><img src="黑马旅游网_files/banner_2.jpg" width="100%" alt="..."><div class="carousel-caption">...</div></div><div class="item"><img src="黑马旅游网_files/banner_3.jpg" width="100%" alt="..."><div class="carousel-caption">...</div></div></div><!-- Controls --><a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div></div></div>
<!--内容部分--><!--黑马精选--><div class="container"><div class="row handpick"><span><img src="黑马旅游网_files/icon_5.jpg">黑马精选</span></div><!--paddtop是离上边距10px--><div class="row paddtop"><div class="col-md-3"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_1.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥699</font></div></div><div class="col-md-3"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_1.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥699</font></div></div><!--thumbnail相框--><div class="col-md-3"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_1.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥699</font></div></div><div class="col-md-3"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_1.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥699</font></div></div></div><!--国内游--><div class="row"><div class="row handpick"><span><img src="黑马旅游网_files/icon_6.jpg">国内游</span></div><!--分为两部分--><!--第一部分大图占4个格--><div class="col-md-4 paddtop"><img src="黑马旅游网_files/guonei_1.jpg"></div><!--第二部分共占8格，分为两行--><div class="col-md-8 paddtop"><div class="row"><div class="col-md-4"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥899</font></div></div><div class="col-md-4"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥899</font></div></div><div class="col-md-4"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥899</font></div></div></div><div class="row"><div class="col-md-4"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥899</font></div></div><div class="col-md-4"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥899</font></div></div><div class="col-md-4"><div class="thumbnail"><img src="黑马旅游网_files/jiangxuan_2.jpg"><p>上海直飞三亚5天4晚自由行(春节预售+亲子/蜜月/休闲游首选+豪华酒店任选+接送机)</p><font color="red">¥899</font></div></div></div></div></div></div><!--页尾--><div class="container-fluid"><div class="row"><img src="黑马旅游网_files/footer_service.png" class="img-responsive"></div><div class="row company">越来越牛的猿 版权所有Copyright 2006-2020, All Rights Reserved 京ICP备18021256号</div></div>
</body>
</html>
2020黑马旅游网项目素材及源码(无废话版)相关推荐
- 旅游网项目案例以及源码
旅游网案例 技术选型 Web层 Servlet:前端控制器 html:视图 Filter:过滤器 BeanUtils:数据封装 Jackson:json序列化工具 Service层 Javamail: ...
- 《黑马旅游网》综合案例源码+分析
1 前言 为了巩固web基础知识,提升综合运用能力,故而讲解此案例.要求,每位同学能够独立完成此案例. 2 项目导入 点击绿色+按钮 选择travel项目的pom.xml文件,点击ok,完成项目导入. ...
- 黑马旅游网项目详细思路和完整代码整理 -附源码
黑马旅游网项目详细思路和完整代码整理 前言 由于新冠病毒的原因,无法上学.百无聊赖下自己开始看视频学习,跟着视频做完了这个项目来检验学习成果,顺便写篇博客来记录一下. 话不多说,开始正题. 文档及其源 ...
- 黑马旅游网项目总结与完善后端（非maven构建）
项目介绍:仿黑马旅游网,项目不是用maven构建的项目,数据库连接池使用的是c3p0不是druid,操作操作sql用的不是jdbcTemplate而是Apache的DBUtlis工具,json工具用的 ...
- 黑马旅游网完整代码_GitHub - mr-yhl/tianjin_travel: 黑马旅游网项目练习
黑马旅游网(web阶段综合练习) 第一天 页面搭建及注册功能 1 项目搭建 1.1 项目介绍 为了巩固web基础知识,提升综合运用能力,故而讲解此案例.要求,每位同学能够独立完成此案例. 1.2 技术 ...
- 最新影视小程序对接苹果cms源码无授权版+详细教程
源码介绍: 最近很火的一款影视小程序 无授权版 感兴趣的可以下载看看 此版本可以跳过微擎,直接用微信开发者工具上传 本程序需要有一定的基础,要对接苹果cms 开发需要工具: 1.下载hbuilder ...
- java旅游网项目_基于jsp的旅游网-JavaEE实现旅游网 - java项目源码
基于jsp+servlet+pojo+mysql实现一个javaee/javaweb的旅游网, 该项目可用各类java课程设计大作业中, 旅游网的系统架构分为前后台两部分, 最终实现在线上进行旅游网各 ...
- 黑马旅游网——旅游路线详情展示和旅游路线收藏功能（完结）
旅游路线详情展示效果: 将该旅游路线的价格.商家.风景图等等详细信息展示到详情页面上: 这个功能实现起来不难,但是比较墨迹,因为这一个页面中的信息要从三张表中查询:商家信息在seller表,图片在ro ...
- 2020最新web前端开发学习资料,全套源码无加密网盘下载
前言--2020web前端开发最新学习资料完整版,全套源码无加密网盘下载 最近小编整理了多套的学习资料(视频+资料+源码),无加密: 两套是某马老师讲解的,讲得挺不错,小编基本学完!还有多个项目实战! ...
最新文章
- 机器学习PAI产品架构
- 如何实现java虚拟机的优化_Java虚拟机JVM优化实战的过程全记录
- Android如何优雅地防止Bean类混淆
- 斯威夫特山地车_斯威夫特| 两个数字相加的程序
- 【Java】Kryo运行报错：Exception in thread “main“ java.lang.IllegalArgumentException:Class is not registered
- 【报告分享】2020新零售直播活力报告.pdf（附下载链接）
- android之wifi开发
- 转：使用NSOperationQueue简化多线程开发
- python2和3切换_python2和python3切换
- xtrabackup导致MYSQL HANG起
- proxy ip 收集方式总结
- 电脑横机服务器维修,三招搞定电脑横机维修
- 基于单片机倾角检测仪设计分享
- 谷歌清楚缓存快捷键_清除浏览器缓存的快捷键是什么
- db mysql导入_db mysql导入数据库
- 制造上云 佛山南海携手阿里云建创新中心
- 手机端android app崩溃的常见类型
- Git LFS 入门指南
- 液晶电视面板市场现状及未来发展趋势
- 计算机本科毕业生去当兵,关于本科毕业生入伍，副连级待遇