基于Bootstarp+Html+Css的爱旅行网站设计

目录
1.引言 2
2.功能需求分析 2
3. 网站结构设计 2
3.1总体设计 2
3.2详细设计 2
3.2.1首页 2
3.2.2酒店浏览 2
3.2.3客服中心 2
3.2.4帮助中心 2
3.2.5登录页面 2
3.2.6注册页面 2
4. 项目效果实现 3
4.1首页 3
4.1.1整体效果 3
4.1.2功能实现 3
4.2酒店浏览 3
4.2.1整体效果 3
4.2.2功能实现 3
4.3客服中心 3
4.3.1整体效果 3
4.3.2功能实现 3
4.4帮助中心 3
4.4.1整体效果 3
4.4.2功能实现 3
4.5登录 4
4.5.1整体效果 4
4.5.2功能实现 4
4.6注册 4
4.6.1整体效果 4
4.6.2功能实现 4
5. 项目总结 4
6. 参考文献 4
1.引言
由于时下大多数人生活优越，交通工具方便快捷，信息获取方便，导致旅游业迅猛发展。为了方便旅游爱好者在网上获取信息，有效地掌握各大旅游景点的详细情况，我们开发出一套适合于旅游者在网络上快速获取信息的管理系统。通过本系统，出行者可以查看某个地区的全部景点列表，本文转载自http://www.biyezuopin.vip/onews.asp?id=15069了解某个景点的详细情况，自驾车、公交线路，获取景区内的旅游地图等。该系统为游客提供全面的旅游服务.
2.功能需求分析
通过本系统，出行者可以查看某个地区的全部景点列表，了解某个景点的详细情况，自驾车、公交线路，获取景区内的旅游地图等。该系统为游客提供全面的旅游景点查询服务。本系统的功能主要包括：旅游查询、酒店查询、交通查询、景点查询、、用户管理。
所用技术：Bootstarp、Html、Css

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link href="css/bootstrap.css" rel="stylesheet"><link href="css/bootstrap.min.css" rel="stylesheet"><link href="css/home.css" rel="stylesheet"><link href="css/home.min.css" rel="stylesheet"><script src="js/jquery-1.12.4.js"></script><script src="js/bootstrap.min.js"></script><title>首页</title>
</head><body data-spy="scroll" data-target="#myScrollspy"><!-- 顶部导航栏 --><div class="nav_top"><div class="nav_left"><div class="nav_text" id="nav_text">让旅行更幸福</div><div id="language" class="dropdown"><div class="nav-pills dropdown-toggle" data-toggle="dropdown" onclick="LanguageSelect()"><span class="glyphicon glyphicon-globe"></span><span class="nav_text">Language</span><span class="caret"></span></div><ul class="dropdown-menu"><li><a href="#">简体中文</a></li><li><a href="#">繁体中文</a></li><li><a href="#">英语</a></li></ul></div></div><div class="nav_right navbar-right"><ul><a href="login.html"><li id="nav_right_li_first">你好，请登录</li></a><a href="registered.html"><li>免费注册</li></a><li><span class="glyphicon glyphicon-envelope"></span> 消息</li><li>我的旅行<span class="caret"></span></li><li>我的订单<span class="caret"></span></li><a href="customer_service.html"><li>客服中心</li></a><li id="nav_right_li_later1"><img src="data:images/手机图标.png"></li><li id="nav_right_li_later2"><img src=" images/微信图标.png "></li></ul></div></div><!-- Logo和搜索框 --><div class="query"><div class="logo"><img src="data:images/logo.jpg" style="margin-left: 20px;"></div><div class="query_arr"><form action="#" class="form-inline"><div class="form-group"><input class=" search form-contorl" type="text" placeholder="景点、酒店、旅行团"></div><input class="btn btn-primary" type="button" value="搜索" /></from></div></div><!-- 菜单导航栏 --><div class="menu"><div class="nav_menu"><ul id="myTab" class="nav nav-tabs"><li><a href="home.html">首页</a></li><li><a data-target="#menu_hotel" href="#" data-toggle="tab">酒店<span class="caret"></span></a></li><li><a href="#" data-target="#menu_travel" data-toggle="tab">旅游<span class="caret"></span></a></li><li><a href="#" data-toggle="tab">跟团游</a></li><li><a href="#" data-target="#menu_plane" data-toggle="tab">机票<span class="caret"></span></a></li><li><a href="#" data-target="#menu_train" data-toggle="tab">火车<span class="caret"></span></a></li><li><a href="#" data-target="#menu_car" data-toggle="tab">汽车•船<span class="caret"></span></a></li><li><a href="#" data-target="#menu_usecar" data-toggle="tab">用车<span class="caret"></span></a></li><li><a href="#" data-target="#menu_tickets" data-toggle="tab">门票<span class="caret"></span></a></li><li><a href="#" data-toggle="tab">攻略</a></li><li><a href="#" data-target="#menu_purchase" data-toggle="tab">全球购<span class="caret"></span></a></li><li><a href="#" data-target="#menu_gift" data-toggle="tab">礼品卡<span class="caret"></span></a></li><li><a href="#" data-target="#menu_business" data-toggle="tab">商旅<span class="caret"></span></a></li><li><a href="#" data-toggle="tab">邮轮</a></li><li><a href="#" data-target="#menu_more" data-toggle="tab">更多<span class="caret"></span></a></li></ul></div><!-- 选项卡 --><div id="myTabContent" class="nav_menu2 tab-content"><!-- 酒店 --><div class="tab-pane" id="menu_hotel"><ul class="navbar-nav"><li><a href="hotel.html">国内酒店</a></li><li><a href="#">海外酒店</a></li><li><a href="#">民宿客栈</a></li><li><a href="#">海外民宿</a></li></ul><div class="menu_order"><a href="#"><img src="data:images/酒店图标.jpg">酒店订单 ></a></div></div><!-- 旅游 --><div class="tab-pane" id="menu_travel"><ul class="navbar-nav"><li><a href="#">旅游首页</a></li><li><a href="#">周末游</a></li><li><a href="#">跟团游</a></li><li><a href="#">自由行</a></li><li><a href="#">私家团</a></li><li><a href="#">门票•玩乐</a></li><li><a href="#">主题游</a></li><li><a href="#">定制旅行</a></li><li><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 class="menu_order"><a href="#"><img src="data:images/旅游图标.jpg">旅游订单 ></a></div></div><!-- 机票 --><div class="tab-pane" id="menu_plane"><ul class="navbar-nav"><li><a href="#">国内/国际·中国港澳台机票</a></li><li><a href="#">特价机票</a></li><li><a href="#">机票+酒店</a></li><li><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 class="menu_order"><a href="#"><img src="data:images/飞机图标.jpg">机票订单 ></a></div></div><!-- 火车 --><div class="tab-pane" id="menu_train"><ul class="navbar-nav"><li><a href="#">国内火车票</a></li><li><a href="#">国际/港台火车票</a></li></ul><div class="menu_order"><a href="#"><img src="data:images/火车图标.jpg">火车票订单 ></a></div></div><!-- 汽车•船 --><div class="tab-pane" id="menu_car"><ul class="navbar-nav"><li><a href="#">汽车票</a></li><li><a href="#">景区/机场专线</a></li><li><a href="#">船票</a></li></ul><div class="menu_order"><a href="#"><img src="data:images/汽车图标.jpg">汽车票订单 ></a></div></div><!-- 用车 --><div class="tab-pane" id="menu_usecar"><ul class="navbar-nav"><li><a href="#">用车首页</a></li><li><a href="#">境外租车</a></li><li><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 class="menu_order"><a href="#"><img src="data:images/租车图标.jpg">用车订单 ></a></div></div><!-- 门票 --><div class="tab-pane" id="menu_tickets"><ul class="navbar-nav"><li><a href="#">门票·玩乐</a></li><li><a href="#">出境WiFi•电话卡</a></li><li><a href="#">周末游</a></li><li><a href="#">上海海昌</a></li></ul><div class="menu_order"><a href="#"><img src="data:images/景点图标.jpg">门票订单 ></a></div></div><!-- 全球购 --><div class="tab-pane" id="menu_purchase"><ul class="navbar-nav"><li><a href="#">名店购</a></li><li><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 class="tab-pane" id="menu_gift"><ul class="navbar-nav"><li><a href="#">礼品卡首页</a></li><li><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 class="menu_order"><a href="#"><img src="data:images/礼品图标.jpg">礼品卡订单 ></a></div></div><!-- 商旅 --><div class="tab-pane" id="menu_business"><ul class="navbar-nav"><li><a href="#">商旅首页</a></li><li><a href="#">企业客户注册</a></li><li><a href="#">会议旅游</a></li></ul></div><!-- 更多 --><div class="tab-pane" id="menu_more"><ul class="navbar-nav"><li><a href="#">会员商城</a></li><li><a href="#">超级会员</a></li><li><a href="#">合作卡</a></li></ul></div></div></div><!-- 广告轮播图 --><div id="myCarousel" class="carousel slide advertising"><!-- 轮播（Carousel）指标 --><ol class="carousel-indicators"><li data-target="#myCarousel" data-slide-to="0" class="active"></li><li data-target="#myCarousel" data-slide-to="1"></li><li data-target="#myCarousel" data-slide-to="2"></li></ol><!-- 轮播（Carousel）项目 --><div id="rotation" class="carousel-inner"><div class="item active"><img src="data:images/广告轮播图1.png"></div><div class="item"><img src="data:images/广告轮播图2.png"></div><div class="item"><img src="data:images/广告轮播图3.png"></div></div></div><!-- 服务搜索 --><div class="service_search"><ul class="species" id="species"><li class="active"><a href="#" data-target="#hotel_search" data-toggle="tab">酒店</a></li><li><a href="#" data-target="#plane_search" data-toggle="tab">机票</a></li><li><a href="#" data-target="#travel_search" data-toggle="tab">旅游</a></li><li><a href="#" data-target="#follow_travel_search" data-toggle="tab">跟团游</a></li><li><a href="#" data-target="#packing_search" data-toggle="tab">打包订</a></li><li><a href="#" data-target="#train_search" data-toggle="tab">火车</a></li><li><a href="#" data-target="#usecar_search" data-toggle="tab">用车</a></li></ul><!-- 服务选项卡 --><div id="species_search" class="tab-content"><!-- 酒店 --><div class="tab-pane in active" id="hotel_search"><ul id="hotel_species" class="domestic_search"><li class="active"><a href="#" data-target="#domestic_hotel_search" data-toggle="tab">国内酒店</a></li><li><a href="#" data-target="#overseas_hotel_search" data-toggle="tab">海外酒店</a></li><li><a href="#" data-target="#folk_hotel_search" data-toggle="tab">民宿</a></li></ul><!-- 酒店选项卡 --><div id="search_box" class="tab-content"><!-- 国内酒店搜索 --><div class="tab-pane in active" id="domestic_hotel_search"><p class="search_destination"><label>目的地</label><input type="text" class="form-control" placeholder="中文/拼音"></p><p class="form-group search_live_time"><label>入住日期</label><input class="form-control" type="date" name="bday" min="2020-11-16"><label>退房日期</label><input class="form-control" type="date" name="bday" max="2020-12-16"></p><p class="form-group room_info"><label>房间数</label><select class="form-control"><option>1间</option><option>2间</option><option>3间</option><option>3间</option><option>4间</option><option>5间</option><option>6间</option><option>7间</option><option>8间</option><option>9间</option></select><label>住客数</label><select class="form-control"><option>1成人</option><option>2成人</option><option>3成人</option><option>4成人</option><option>5成人</option></select></p><p class="hotel_star"><label>酒店级别</label><select class="form-control"><option>不限</option><option>五星级/豪华</option><option>四星级/高档</option><option>三星级/舒适</option><option>二星级以下/经济</option></select><label>关键词</label><input type="text" class="form-control" placeholder="（选填）酒店名/地标/商圈"></p><p id="domestic_hotel_search_btn"><input class="btn btn-primary" type="button" value="搜索" /></p></div><!-- 海外酒店搜索 --><div class="tab-pane" id="overseas_hotel_search"><p class="search_destination"><label>目的地</label><input type="text" class="form-control" placeholder="中文/拼音"></p><p class="form-group search_live_time"><label>入住日期</label><input class="form-control" type="date" name="bday" min="2020-11-16"><label>退房日期</label><input class="form-control" type="date" name="bday" max="2020-12-16"></p><p class="form-group room_info"><label>房间数</label><select class="form-control"><option>1间</option><option>2间</option><option>3间</option><option>3间</option><option>4间</option><option>5间</option><option>6间</option><option>7间</option><option>8间</option><option>9间</option></select><label>住客数</label><select class="form-control"><option>1成人</option><option>2成人</option><option>3成人</option><option>4成人</option><option>5成人</option></select></p><p class="hotel_star"><label>关键词</label><input type="text" class="form-control" placeholder="（选填）酒店名/地标/商圈"></p><p id="domestic_hotel_search_btn"><input class="btn btn-primary" type="button" value="搜索" /></p></div><!-- 民宿搜索 --><div class="tab-pane" id="folk_hotel_search"><p class="search_destination"><label>目的地</label><input type="text" class="form-control" placeholder="中文/拼音"></p><p class="form-group search_live_time"><label>入住日期</label><input class="form-control" type="date" name="bday" min="2020-11-16"><label>退房日期</label><input class="form-control" type="date" name="bday" max="2020-12-16"></p><p class="form-group room_info"><label>入住人数</label><select class="form-control"><option>不限</option><option>1人</option><option>2人</option><option>3人</option><option>4人</option><option>5人</option><option>6人</option><option>7人</option><option>8人</option><option>9人</option><option>10人以上</option></select></p><p class="hotel_star"><label>关键词</label><input type="text" class="form-control" placeholder="（选填）酒店名/地标/商圈"></p><p id="domestic_hotel_search_btn"><input class="btn btn-primary" type="button" value="搜索" /></p></div></div></div><!-- 机票 --><div class="tab-pane" id="plane_search"><ul id="plane_species"><li class="active"><a href="#" data-target="#domestic_plane_search" data-toggle="tab">国内机票</a></li><li class="plane_species_li2"><a href="#" data-target="#overseas_plane_search" data-toggle="tab">国际·港澳台机票</a></li><li><a href="#" data-target="#find_lowerprice" data-toggle="tab">发现低价</a></li></ul></div><!-- 旅游 --><div class="tab-pane" id="travel_search"><ul id="travel_species"><li class="active"><a href="#" data-target="#travel_all_search" data-toggle="tab">全部</a></li><li><a href="#" data-target="#travel_tickets_search" data-toggle="tab">门票</a></li><li><a href="#" data-target="#travel_around_search" data-toggle="tab">周边游</a></li><li><a href="#" data-target="#travel_free_search" data-toggle="tab">自由行</a></li><li><a href="#" data-target="#travel_group_search" data-toggle="tab">跟团游</a></li><li><a href="#" data-target="#travel_cruise_search" data-toggle="tab">邮轮</a></li></ul></div><!-- 跟团游 --><div class="tab-pane" id="follow_travel_search"><ul id="follow_travel_species"><li class="active"><a href="#" data-target="#recommended_search" data-toggle="tab">推荐</a></li><li><a href="#" data-target="#travel_around_search" data-toggle="tab">周边跟团</a></li><li><a href="#" data-target="#domestic_follow_search" data-toggle="tab">境内跟团</a></li><li><a href="#" data-target="#foreign_follow_search" data-toggle="tab">境外跟团</a></li></ul></div><!-- 打包订 --><div class="tab-pane" id="packing_search"><ul id="packing_species"><li class="active"><a href="#" data-target="#plane_hotel_search" data-toggle="tab">机票+酒店</a></li></ul></div><!-- 火车 --><div class="tab-pane" id="train_search"><ul id="train_species"><li class="active"><a href="#" data-target="#domestic_train_search" data-toggle="tab">国内火车票</a></li><li class="plane_species_li2"><a href="#" data-target="#overseas_train_search" data-toggle="tab">国际·港澳台火车票</a></li><li><a href="#" data-target="#domestic_car_search" data-toggle="tab">国内汽车票</a></li></ul></div><!-- 用车 --><div class="tab-pane" id="usecar_search"><ul id="usecar_species"><li class="active"><a href="#" data-target="#domestic_pick_up" data-toggle="tab">国内接送机</a></li><li><a href="#" data-target="#overseas_pick_up" data-toggle="tab">国外接送机</a></li><li><a href="#" data-target="#domestic_rental_car" data-toggle="tab">国内租车</a></li><li><a href="#" data-target="#overseas_rental_car" data-toggle="tab">国外租车</a></li><li><a href="#" data-target="#daily_rent_special" data-toggle="tab">日租包车</a></li></ul></div></div></div><!-- 主体内容 --><div id="content"><div class="affix_nav" id="myScrollspy"><ul class="nav nav-tabs nav-stacked" data-spy="affix" data-offset-top="100"><li class="active"><a href="#affix_nav_travel">旅游</a></li><li><a href="#affix_nav_hotel">酒店</a></li><li><a href="#affix_nav_plane">机票</a></li><li><a href="#affix_nav_usercar">用车</a></li><li style="display: none;"><a href="#section-5"></a></li><li><a href="#affix_nav_play">玩乐</a></li></ul></div><div id="affix_content"><!-- 旅游 --><div id="affix_nav_travel"><ul id="package_species_travel" class="package_speciea_nav"><li class="active"><a href="#hot" data-toggle="tab">热门</a></li><li><a href="#around_travel" data-toggle="tab">周边游</a></li><li><a href="#tickets" data-toggle="tab">门票</a></li><li><a href="#outbound_travel" data-toggle="tab">出境游</a></li><li><a href="#domestic_tourism" data-toggle="tab">境内游</a></li><li><a href="#cruise" data-toggle="tab">邮轮</a></li><li><a href="#local_play" data-toggle="tab">当地玩乐</a></li><li><a href="#subject_travel" data-toggle="tab">主题游</a></li><li><a href="#">高端游</a></li></ul><div id="recommended_menu1" class="tab-content recommended_menu"><!-- 热门 --><div class="tab-pane in active" id="hot"><ul id="place_nav" class="place_nav"><li class="active"><a href="#Domestic" data-toggle="tab">境内</a></li><li><a href="#Japan" data-toggle="tab">日本</a></li><li><a href="#SoutheastAsia" data-toggle="tab">东南亚</a></li><li><a href="#European" data-toggle="tab">欧洲</a></li><li><a href="#Americas" data-toggle="tab">美洲</a></li><li><a href="#EastAfrica" data-toggle="tab">澳中东非</a></li></ul><div id="recommended_menu_name" class="tab-content recommended_menu_name"><!-- 境内 --><div class="tab-pane in active recommended_menu_name_box" id="Domestic"><div class="box1"><div><img src="data:images/三亚.jpg"></div><div><img src="data:images/成都.jpg"></div><div><img src="data:images/丽江.jpg"></div><div><img src="data:images/张家界.jpg"></div><div><img src="data:images/重庆.jpg"></div><div><img src="data:images/北京.jpg"></div><div><img src="data:images/桂林.jpg"></div><div><img src="data:images/厦门.jpg"></div></div><div id="box_travel"><img src="data:images/旅游聚划算.jpg"></div></div><!-- 日本 --><div class="tab-pane" id="Japan">2</div><!-- 东南亚 --><div class="tab-pane" id="SoutheastAsia">3</div><!-- 欧洲 --><div class="tab-pane" id="European">4</div><!-- 美洲 --><div class="tab-pane" id="Americas">5</div><!-- 澳中东非 --><div class="tab-pane" id="EastAfrica">6</div></div></div><!-- 周边游 --><div class="tab-pane" id="around_travel"></div><!-- 门票 --><div class="tab-pane" id="tickets"></div><!-- 出境游 --><div class="tab-pane" id="outbound_travel"></div><!-- 境内游 --><div class="tab-pane" id="domestic_tourism"></div><!-- 邮轮 --><div class="tab-pane" id="cruise"></div><!-- 当地玩乐 --><div class="tab-pane" id="local_play"></div><!-- 主题游 --><div class="tab-pane" id="subject_travel"></div></div></div><!-- 酒店 --><div id="affix_nav_hotel"><ul id="package_species_hotel" class="package_speciea_nav"><li class="active"><a href="#overseas_hotel_recommended" data-toggle="tab">海外酒店</a></li><li><a href="#overseas_home_recommended" data-toggle="tab">海外民宿+短租</a></li><li><a href="#domestic_hotel_recommended" data-toggle="tab">国内酒店</a></li><li><a href="#home_hotel_recommended" data-toggle="tab">客栈民宿</a></li></ul><div id="recommended_menu2" class="tab-content recommended_menu"><!-- 海外酒店 --><div class="tab-pane in active" id="overseas_hotel_recommended"><div class="entrance"><label>促销</label><ul><li><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><label>发现酒店</label><ul><li><a href="#">流行与复古结合的热门人气地——首尔仁寺洞钟路</a></li><li><a href="#">特别的旅行，美味的餐食，绝美的夜景，这次冬季旅行就去釜山吧</a></li><li><a href="#">孟加拉国吉大港酒店推荐</a></li><li><a href="#">最受国人欢迎的伦敦酒店</a></li></ul></div><div class="product"><ul id="place_nav2" class="place_nav"><li class="active"><a href="#hot_city" data-toggle="tab">热门城市</a></li><li><a href="#city_shopping" data-toggle="tab">都市购物</a></li><li><a href="#Island_leisure" data-toggle="tab">海岛休闲</a></li><li><a href="#resort" data-toggle="tab">度假胜地</a></li></ul><div id="recommended_menu_name2" class="tab-content recommended_menu_name2"><!-- 热门城市 --><div class="tab-pane in active recommended_menu_name_box2" id="hot_city"><div><img src="data:images/新加坡.jpg"></div><div><img src="data:images/曼谷.jpg"></div><div><img src="data:images/东京.jpg"></div><div><img src="data:images/吉隆玻.jpg"></div><div><img src="data:images/大阪.jpg"></div><div><img src="data:images/普吉岛.jpg"></div></div><div id="box_hotel"><img src="data:images/泰国酒店精选.jpg"></div><!-- 都市购物 --><div class="tab-pane" id="city_shopping">2</div><!-- 海岛休闲 --><div class="tab-pane" id="Island_leisure">3</div><!-- 度假胜地 --><div class="tab-pane" id="resort">4</div></div></div></div><!-- 海外民宿+短租 --><div class="tab-pane" id="overseas_home_recommended">2</div><!-- 国内酒店 --><div class="tab-pane" id="domestic_hotel_recommended">3</div><!-- 客栈民宿 --><div class="tab-pane" id="home_hotel_recommended">3</div></div></div><!-- 机票 --><div id="affix_nav_plane"><ul id="package_species_plane" class="package_speciea_nav"><li class="active"><a href="#International_air_ticket" data-toggle="tab">国际•港澳台特价机票</a></li><li><a href="#Domestic_air_ticket" data-toggle="tab">国内特价机票</a></li></ul><!-- 一级导航栏选项卡 --><div id="recommended_menu3" class="tab-content recommended_menu"><!-- 国际•港澳台特价机票 --><div class="tab-pane in active" id="International_air_ticket"><div class="product_hd"><ul id="place_nav3" class="place_nav"><li class="active"><a href="#hit_back" data-toggle="tab">热门往返</a></li><li><a href="#asia" data-toggle="tab">亚洲</a></li><li><a href="#european" data-toggle="tab">欧洲</a></li><li><a href="#americas" data-toggle="tab">美洲</a></li></ul><p><a href="#">更多国际•港澳台特价机票 ></a></p></div><!-- 二级导航栏选项卡 --><div id="recommended_menu_name3" class="tab-content recommended_menu_name3"><!-- 热门往返 --><div class="tab-pane in active recommended_menu_name_box3" id="hit_back"><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div><div class="plane_info"><p class="trip">上海<span class="glyphicon glyphicon-transfer"></span>台北</p><p><span class="data">11月19日 - 11月26日</span></p><p>&yen;<span class="price">590</span>起<span class="snap">立抢</span></p></div></div><!-- 亚洲 --><div class="tab-pane" id="asia">2</div><!-- 欧洲 --><div class="tab-pane" id="european">3</div><!-- 美洲 --><div class="tab-pane" id="americas">4</div></div></div><!-- 国内特价机票 --><div class="tab-pane" id="Domestic_air_ticket">2</div></div></div><!-- 用车 --><div id="affix_nav_usercar"><ul id="package_species_usercar" class="package_speciea_nav"><li class="active"><a href="#outside_car_rental" data-toggle="tab">境外租车</a></li><li><a href="#outside_airport_transportation" data-toggle="tab">境外接送机</a></li><li><a href="#domestic_car_rental" data-toggle="tab">国内租车</a></li><li><a href="#domestic_airport_transportation" data-toggle="tab">国内接送机</a></li><li><a href="#daily_special_rent" data-toggle="tab">日租包车</a></li></ul><!-- 一级导航栏选项卡 --><div id="recommended_menu4" class="tab-content recommended_menu"><!-- 境外租车 --><div class="tab-pane in active" id="outside_car_rental"><div class="entrance"><label>热门城市</label><ul><li><a href="#">洛杉矶</a></li><li><a href="#">旧金山</a></li><li><a href="#">墨尔本</a></li><li><a href="#">纽约</a></li><li><a href="#">曼谷</a></li><li><a href="#">基督城</a></li><li><a href="#">普吉岛</a></li><li><a href="#">温哥华</a></li><li><a href="#">悉尼</a></li><li><a href="#">奥克兰</a></li><li><a href="#">拉斯维加斯</a></li><li><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 class="product"><div class="product_hd"><ul id="place_nav4" class="place_nav"><li class="active"><a href="#usercar_americas" data-toggle="tab">美国</a></li><li><a href="#usercar_Thailand" data-toggle="tab">泰国</a></li><li><a href="#usercar_Australia" data-toggle="tab">澳大利亚</a></li><li><a href="#usercar_Britain" data-toggle="tab">英国</a></li><li><a href="#usercar_Canada" data-toggle="tab">加拿大</a></li></ul><p><a href="#"> 更多境外租车 ></a></p></div><div id="recommended_menu_name4" class="tab-content recommended_menu_name4"><div class="tab-pane in active recommended_menu_name_box4" id="usercar_americas"><div class="thumbnail"><img src="https://pic.c-ctrip.com/car/osd/online/vehicle_new/Ford_Fiesta.png"><div class="car_info"><p class="car_name">福特 嘉年华 Fiesta</p><p class="city">美国.洛杉矶<span class="car_price">&yen;<span class="price">161</span>起</span></p></div></div><div class="thumbnail"><img src="https://pic.c-ctrip.com/car/osd/online/vehicle_new/Ford_Fusion.png"><div class="car_info"><p class="car_name">福特 Fusion</p><p class="city">美国.旧金山<span class="car_price">&yen;<span class="price">232</span>起</span></p></div></div><div class="thumbnail"><img src="https://pic.c-ctrip.com/car/osd/online/vehicle_new/Chrysler_300.png"><div class="car_info"><p class="car_name">克莱斯勒 300</p><p class="city">美国.拉斯维加斯<span class="car_price">&yen;<span class="price">295</span>起</span></p></div></div><div class="thumbnail"><img src="https://pic.c-ctrip.com/car/osd/online/vehicle_new/Kia_Soul.png"><div class="car_info"><p class="car_name">起亚 Soul</p><p class="city">美国.纽约<span class="car_price">&yen;<span class="price">385</span>起</span></p></div></div></div><div class="tab-pane" id="usercar_Thailand">2</div><div class="tab-pane" id="usercar_Australia">3</div><div class="tab-pane" id="usercar_Britain">4</div><div class="tab-pane" id="usercar_Canada">5</div></div></div></div><!-- 境外接送机 --><div class="tab-pane" id="outside_airport_transportation">2</div><!-- 国内租车 --><div class="tab-pane" id="domestic_car_rental">3</div><!-- 国内接送机 --><div class="tab-pane" id="domestic_airport_transportation">4</div><!-- 日租包车 --><div class="tab-pane" id="daily_special_rent">5</div></div></div><!-- 玩乐 --><div id="affix_nav_play"><ul id="package_species_play" class="package_speciea_nav"><li class="active"><a href="#outside_play" data-toggle="tab">当地玩乐·出境</a></li><li><a href="#domestic_play" data-toggle="tab">当地玩乐·境内</a></li></ul><!-- 一级导航栏选项卡 --><div id="recommended_menu5" class="tab-content recommended_menu"><!-- 当地玩乐·出境 --><div class="tab-pane in active" id="outside_play"><div class="entrance"><label>热门目的地</label><ul><li><a href="#">普吉岛</a></li><li><a href="#">曼谷</a></li><li><a href="#">清迈</a></li><li><a href="#">巴厘岛</a></li><li><a href="#">东京</a></li><li><a href="#">沙巴</a></li><li><a href="#">芭提雅</a></li><li><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 class="product"><div class="product_hd"><ul id="place_nav5" class="place_nav"><li class="active"><a href="#day_trip" data-toggle="tab">一日游</a></li><li><a href="#local_traffic" data-toggle="tab">当地交通</a></li><li><a href="#local_cuisine" data-toggle="tab">当地美食</a></li><li><a href="#tourism_services" data-toggle="tab">旅游服务</a></li></ul><p><a href="#"> 更多境外租车 ></a></p></div><!-- 二级导航栏选项卡 --><div id="recommended_menu_name5" class="tab-content recommended_menu_name5"><div class="tab-pane in active recommended_menu_name_box5" id="day_trip"><div class="thumbnail"><img src="https://dimg04.c-ctrip.com/images/350j0x000000l6xc2727F_C_280_158.jpg"><div class="play_info"><p class="play_name">普吉岛斯米兰群岛浮潜一日游【多船型/快速登岛/2次浮潜】</p><p class="attractions">普吉岛<span class="play_price">&yen;<span class="price">161</span>起</span></p></div></div><div class="thumbnail"><img src="https://dimg08.c-ctrip.com/images/100g10000000ov0m0BAA6_C_280_158.jpg"><div class="play_info"><p class="play_name">普吉岛查龙寺+卡伦观景台+神仙半岛+普吉镇环岛一日游【VIP包车/线路可定制/说走就走】</p><p class="attractions">普吉岛<span class="play_price">&yen;<span class="price">232</span>起</span></p></div></div><div class="thumbnail"><img src="https://dimg04.c-ctrip.com/images/350q15000000yiwljC92F_C_280_158.jpg"><div class="play_info"><p class="play_name">普吉岛皮皮岛浮潜一日游【可选竹子岛/鸡蛋岛/蜜月岛/网红游艇】</p><p class="attractions">普吉岛<span class="play_price">&yen;<span class="price">295</span>起</span></p></div></div><div class="thumbnail"><img src="https://dimg04.c-ctrip.com/images/35051a0000019jbkbC9BC_C_280_158.jpg"><div class="play_info"><p class="play_name">普吉岛皇帝岛+皇帝岛潜水一日游【豪华游艇躺着出行/专业深潜船/多船可选】</p><p class="attractions">普吉岛<span class="play_price">&yen;<span class="price">385</span>起</span></p></div></div></div><div class="tab-pane" id="local_traffic">2</div><div class="tab-pane" id="local_cuisine">3</div><div class="tab-pane" id="tourism_services">4</div></div></div></div><!-- 当地玩乐·境内 --><div class="tab-pane" id="domestic_play">2</div></div></div></div></div><!-- 底部 --><div id="foot"><p><a href="#">网站导航</a><a href="#">宾馆索引</a><a href="#">机票索引</a><a href="#">旅游索引</a><a href="#">商旅索引</a><a href="#">攻略索引</a><a href="#">关于爱旅行</a><a href="#">企业公民</a><a href="#">诚聘英才</a><a href="#">智慧旅游</a><a href="#">分销联盟</a><a href="#">代理合作</a><a href="#">企业商旅</a><a href="#" 中小企业差旅></a><a href="#">广告业务</a><a href="#" class="foot_a_later">联系我们</a></p><p><a href="#">加盟合作</a><a href="#">酒店加盟</a><a href="#">目的地及景区合作</a><a href="#">用户协议</a><a href="#">隐私政策</a><a href="#">营业执照</a><a href="#">旅游度假资质</a><a href="#">保险代理</a><a href="#">友情链接</a></p><p><a href="#">Copyright©1990-2020& ctrip.com. All rights reserved. | </a><a href="#">ICP证：沪B2-20050130</a><a href="#">沪ICP备08023580号</a></p></div>
</body>
<script>//两秒钟执行一次$('.carousel').carousel({interval: 3000})
</script></html>

基于Bootstarp+Html+Css的爱旅行网站设计相关推荐

HTML5期末大作业：旅行网站设计——开心网旅游(11页) web前端期末大作业 html+css+javascript网页设计实例
HTML5期末大作业:旅行网站设计--开心网旅游(11页) web前端期末大作业 html+css+javascript网页设计实例常见网页设计作业题材有个人. 美食. 公司. 学校. 旅游. 电 ...
基于jsp+Spring+mybatis的SSM企业门户网站设计和实现
本项目演示链接地址 > 前言人类社会已经迈入了21世纪,信息技术的浪潮也冲击着社会的方方面面.以计算机互联网为核心的科学技术为社会各行各业提供了前所未有的机会和发展潜力.生产业也不例外.互联网 ...
java毕业设计——基于Java+Bootstrap+Mysql的电影评论网站设计与实现（毕业论文+程序源码）——电影评论网站
基于Java+Bootstrap+Mysql的电影评论网站设计与实现(毕业论文+程序源码) 大家好,今天给大家介绍基于Java+Bootstrap+Mysql的电影评论网站设计与实现,文章末尾附有本毕 ...
基于javaweb+mysql的婚纱影楼摄影预约网站设计和实现(javaweb+ssm+springboot)
基于javaweb+mysql的婚纱影楼摄影预约网站设计和实现(javaweb+ssm+springboot) 运行环境 Java≥8.MySQL≥5.7 开发工具 eclipse/idea/myec ...
HTML5期末大作业：英雄联盟网站设计——英雄联盟LOL(4页) HTML+CSS+JavaScript web期末网站设计大作业
HTML5期末大作业:英雄联盟网站设计--英雄联盟LOL(4页) HTML+CSS+JavaScript web期末网站设计大作业常见网页设计作业题材有个人. 美食. 公司. 学校. 旅游. 电商 ...
基于html5的音乐网站,基于C#和HTML5的在线音乐网站设计
毕业设计是基于c#和html5的在线音乐网站设计,下载了visual studio 2017准备开发.这个软件可以写页面也可以开发后台,很方便了. 项目的创建:asp.net web,visual s ...
asp毕业设计——基于asp+access的精品课程教学网站设计与实现（毕业论文+程序源码）——精品课程教学网站
基于asp+access的精品课程教学网站设计与实现(毕业论文+程序源码) 大家好,今天给大家介绍基于asp+access的精品课程教学网站设计与实现,文章末尾附有本毕业设计的论文和源码下载地址哦.需 ...
最新30个优秀的旅行网站设计作品欣赏
您可能还喜欢 12个优秀的 HTML5 网站设计案例欣赏 30个漂亮的个人作品集网页设计欣赏分享35个非常漂亮的单页网站设计欣赏 45个优秀的国外电子商务网站设计欣赏 33个非常优秀的网站底部设计案 ...
asp毕业设计——基于asp+access的辅导员之家网站设计与实现（毕业论文+程序源码）——辅导员之家网站
基于asp+access的辅导员之家网站设计与实现(毕业论文+程序源码) 大家好,今天给大家介绍基于asp+access的辅导员之家网站设计与实现,文章末尾附有本毕业设计的论文和源码下载地址哦.需要下 ...

基于Bootstarp+Html+Css的爱旅行网站设计

基于Bootstarp+Html+Css的爱旅行网站设计相关推荐

最新文章

热门文章