Repository: mingyangya/tour-project
Branch: master
Commit: bd64486099bd
Files: 16
Total size: 65.4 KB
Directory structure:
gitextract_by42yn_g/
├── .gitignore
├── README.md
├── about.html
├── css/
│ ├── basic.css
│ ├── column.css
│ └── style.css
├── index.html
├── informations.html
├── scenery.html
├── ticket.html
└── wap/
├── README.md
├── about.html
├── css/
│ └── style.css
├── index.html
├── informations.html
└── ticket.html
================================================
FILE CONTENTS
================================================
================================================
FILE: .gitignore
================================================
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
# UI files
UI
================================================
FILE: README.md
================================================
# HTML5+CSS实现雪花旅行社
## pc端
演示地址:https://mingyangya.github.io/tour-project/index.html
- 首页效果

- 旅游资讯效果

- 机票预定效果

- 风景欣赏效果

- 公司简介效果

## 手机版
演示地址:https://mingyangya.github.io/tour-project/wap/index.html
- 首页效果

- 资讯效果

- 票务效果

- 关于我们效果

================================================
FILE: about.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>关于我们--旅游网站</title>
<link rel="stylesheet" href="css/column.css">
<link rel="stylesheet" href="css/basic.css">
</head>
<body>
<header>
<nav id="nav">
<div id="logo"><img src="img/logo.png" alt=""></div>
<ul>
<li><a href="index.html">首页</a></li>
<li><a href="informations.html">旅游资讯</a></li>
<li><a href="ticket.html">机票订购</a></li>
<li><a href="scenery.html">风景欣赏</a></li>
<li class="active"><a href="about.html">公司简介</a></li>
</ul>
</nav>
</header>
<div id="headline">
<div class="headline">
<hgroup>
<h2>旅游资讯</h2>
<p>介绍各种最新旅游信息、资讯要闻、景点攻略等</p>
</hgroup>
</div>
</div>
<div id="container">
<article class="list about">
<section>
<h2>关于我们</h2>
<p>雪花旅行社旅游网创立于2006 年10 月,以“让旅游更简单”为使命,为消费者提供由北京、上海、广州、深圳等64 个城市出发的旅游产品预订服务,产品全面,价格透明,全年365 天24 小时400 电话预订,并提供丰富的后续服务和保障。
目前,雪花旅行社旅游网提供8 万余种旅游产品供消费者选择,涵盖跟团、自助、自驾、邮轮、酒店、签证、景区门票以及公司旅游等,已成功服务累计超过400 万人次出游。
同时基于雪花旅行社旅游网全球中文景点目录以及中文旅游社区,可以更好地帮助游客了解目的地信息,妥善制定好出游计划,并方便地预订旅程中的服务项目。</p>
</section>
<section class="address">
<h2>联系方式</h2>
<address>
<ul>
<li>雪花旅行社股份有限公司</li>
<li>地址:江苏省盐城市亭湖区大庆中路1234 号</li>
<li>邮编:1234567</li>
<li>电话:010-88888888</li>
<li>传真:010-88666666</li>
</ul>
</address>
</section>
</article>
<aside class="sidebar">
<div class="recommend sidebox">
<h3>景点推荐</h3>
<div class="tag">
<ul>
<li><a href="###">曼谷(12)</a></li>
<li><a href="###">东京(5)</a></li>
<li><a href="###">西双版纳(8)</a></li>
<li><a href="###">漓江(16)</a></li>
<li><a href="###">呼伦贝尔(4)</a></li>
<li><a href="###">首尔(9)</a></li>
<li><a href="###">巴厘岛(15)</a></li>
<li><a href="###">土耳其(22)</a></li>
<li><a href="###">夏威夷(5)</a></li>
<li><a href="###">巴厘岛(11)</a></li>
<li><a href="###">毛里求斯(7)</a></li>
<li><a href="###">吉普岛(4)</a></li>
<li><a href="###">希腊(18)</a></li>
<li><a href="###">法瑞意(8)</a></li>
<li><a href="###">马尔代夫(9)</a></li>
<li><a href="###">新西兰(16)</a></li>
<li><a href="###">埃及(11)</a></li>
<li><a href="###">迪拜(14)</a></li>
<li><a href="###">斯里兰卡(7)</a></li>
<li><a href="###">麦哈顿(3)</a></li>
<li><a href="###">大阪(15)</a></li>
</ul>
</div>
</div>
<div class="hot sidebox">
<h3>热门旅游</h3>
<div class="figure">
<figure>
<img src="img/hot1.jpg" alt="曼谷-芭提雅6日游">
<figcaption>曼谷-芭提雅6日游</figcaption>
</figure>
<figure>
<img src="img/hot2.jpg" alt="马尔代夫双鱼6日游">
<figcaption>马尔代夫双鱼6日游</figcaption>
</figure>
<figure>
<img src="img/hot3.jpg" alt="海南双飞5日游">
<figcaption>海南双飞5日游</figcaption>
</figure>
<figure>
<img src="img/hot4.jpg" alt="富山大阪东京8日游">
<figcaption>富山大阪东京8日游</figcaption>
</div>
</div>
<div class="treasure sidebox">
<h3>旅游百宝箱</h3>
<div class="box">
<a href="" class="trea1">天气预报</a>
<a href="" class="trea2">火车票查询</a>
<a href="" class="trea3">航空查询</a>
<a href="" class="trea4">地铁线路查询</a>
</div>
</div>
</aside>
</div>
<footer id="footer">
<div class="top">
<div class="block left">
<h3>合作伙伴</h3>
<hr>
<ul>
<li>途牛旅游网</li>
<li>驴妈妈旅游网</li>
<li>携程旅游</li>
<li>中国去青年旅行社</li>
</ul>
</div>
<div class="block middle">
<h3>旅游FAQ</h3>
<hr>
<ul>
<li>旅游合同签订方式?</li>
<li>儿童价是基于什么制定的?</li>
<li>旅游的线路品质怎么界定的?</li>
<li>单房差是什么?</li>
<li>旅游保险有那些种类?</li>
</ul>
</div>
<div class="block right">
<h3>联系方式</h3>
<hr>
<ul>
<li>微博:weibo.com/xuehua</li>
<li>邮件:xuehua@xuehua.com</li>
<li>地址:江苏盐城无名路123 号</li>
</ul>
</div>
</div>
<div class="bottom">Copyright © XUEHUA 雪花旅行社| 苏ICP 备120110119 号| 旅行社经营许可证:L-YC-BK12345</div>
</footer>
</body>
</html>
================================================
FILE: css/basic.css
================================================
@charset "utf-8";
body,ul,ol,li ,h2,h3,p,hr,figure{
padding:0;
margin:0;
}
body {
font-family: "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei UI","Microsoft YaHei",SimHei,"宋体",simsun,sans-serif;
}
ol,ul,li{
list-style: none;
}
a {
text-decoration: none;
}
input {
border:0;
padding:0;
margin:0;
}
header{
width:100%;
min-width: 1263px;
height:70px;
background: #333;
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.3);
z-index: 999;
}
nav {
width:1263px;
margin:0 auto;
color:#fff;
}
nav #logo {
float:left;
}
nav ul{
float:right;
width:800px;
line-height: 70px;
text-align: center;
}
nav ul li{
float:left;
width:140px;
}
nav ul li a{
display: block;
color: #eee;
}
nav ul li a:hover,.active a{
list-style: none;
display: block;
background: #000;
}
#footer {
height:361px;
background: #222;
clear:both;
}
.top {
width:1263px;
margin:0 auto;
height:300px;
text-align: center;
}
.block {
display: inline-block;
width:410px;
height:280px;
text-align: left;
vertical-align: top;
color:#ccc;
}
.block h3{
font-weight: normal;
font-size: 24px;
margin:20px 0 10px 0;
}
.block hr{
border:1px dashed #333;
width:90%;
}
.block ul{
font-size: 18px;
line-height: 2.2;
color:#777;
}
.bottom {
height:60px;
background: #000;
color:#fff;
text-align: center;
line-height:60px;
border-top:1px solid #444;
}
================================================
FILE: css/column.css
================================================
@charset "utf-8";
#headline {
height:300px;
width:100%;
min-width:1263px;
background: linear-gradient(to right bottom, rgba(0,0,0,0.7), rgba(0,0,0,0)), url(../img/headline.jpg) no-repeat center;
}
.headline {
width:1263px;
height:300px;
margin:0 auto;
}
hgroup {
padding:100px 0 0 150px;
}
.headline h2{
font-size:45px;
color:#eee;
letter-spacing: 1px;
}
.headline p{
font-size:20px;
color:#eee;
letter-spacing: 1px;
}
#container {
width:1263px;
margin:30px auto;
overflow: hidden;
}
.sidebar {
float:right;
width:340px;
color:#666;
}
.sidebox {
height:400px;
text-align: center;
margin-bottom:20px;
border:1px solid #ccc;
}
.sidebox h3{
font-size: 20px;
font-weight: normal;
letter-spacing: 1px;
height:48px;
line-height:48px;
background: #fafafa;
text-align:left;
text-indent: 20px;
margin-bottom: 5px;
}
.sidebox li{
display: inline-block;
height:45px;
width:100px;
margin:2px;
line-height:45px;
color:#fff;
background: #eee;
}
.tag li a {
color:#999;
}
.tag li a:hover {
background: #458b00;
display:block;
color:#fff;
}
.sidebox .figure{
width:340px;
text-align: center;
}
.figure figure{
display: inline-block;
padding:5px;
}
.figure figcaption {
color:#666;
}
.box {
padding:10px 0 10px 0;
}
.box a {
width:150px;
height:45px;
line-height: 45px;
text-indent: 10px;
font-size: 16px;
display: inline-block;
color:#999;
margin:2px ;
}
.box a.trea1 {
background: #eee url(../img/trea1.png) no-repeat 10px center;
}
.box a.trea2 {
background:#eee url(../img/trea2.png) no-repeat 10px center;
}
.box a.trea3 {
background:#eee url(../img/trea3.png) no-repeat 10px center;
}
.box a.trea4 {
background: #eee url(../img/trea4.png) no-repeat 10px center;
}
.treasure {
height:170px;
}
.list {
float:left;
width:900px;
}
.infos {
width:900px;
height:50px;
background: #eee;
}
.infos_left{
float:left;
line-height: 48px;
text-align: center;
}
.infos_left li {
display: inline-block;
width:150px;
height:48px;
}
.infos_left li a {
display: block;
color: #666;
cursor: pointer;
}
.infos_left li:first-child {
position: relative;
background: #fff;
border-top:2px solid #458b00;
left:1px;
}
.infos_right{
width:300px;
height:50px;
line-height: 50px;
float:right;
text-align: center;
margin-right:-30px;
}
.infos_right li {
display: inline-block;
width:60px;
}
.infos_right li a.selected,
.infos_right li a:hover{
background: #458b00;
color:#fff;
}
.infos_right li a {
color:#666;
width:60px;
padding:5px;
font-size:14px;
}
.tour {
width:898px;
height:231px;
margin-top:20px;
position: relative;
border:1px solid #ccc;
color:#666;
}
.tour img {
float:left;
}
.tour .description {
float:right;
width:498px;
height:200px;
padding:10px 0 0 20px;
}
.description h3 {
font-size: 24px;
width:300px;
font-weight: normal;
}
.description p {
font-size: 14px;
line-height: 2;
width:300px;
margin-top:10px;
}
.description ol li {
font-size: 16px;
width:300px;
margin-top:10px;
height:20px;
line-height: 20px;
}
.description ol li mark {
color:#458b00;
border:1px solid #458b00;
padding:0 5px;
background: #fff;
border-radius: 5px;
}
.description .type {
position:absolute;
left:0;
top:0;
width:80px;
height:20px;
background: #59b200;
line-height: 20px;
text-align: center;
font-size:14px;
color:#fff;
}
.description .disc{
position: absolute;
top:0;
right:0;
width:52px;
height:52px;
background: url(../img/disc.png) no-repeat;
}
.description .disc span{
display: block;
width:52px;
height:52px;
transform: rotate(45deg);
padding: 5px 0 0 0px;
color: #ff7a4d;
font-size: 14px;
text-indent: 7px;
}
.description .buy {
position: absolute;
top:50px;
right:20px;
}
.buy .price {
color:#f60;
font-size: 20px;
}
.buy .price strong {
color:#f60;
font-size: 36px;
}
.buy .price s {
color:#999;
font-size:19px;
}
.buy .reserve a {
display: block;
width:150px;
height:50px;
background: #f80;
text-align: center;
line-height: 50px;
border-radius: 5px;
color:#fff;
font-size:20px;
margin-top:10px;
}
.description .footer {
width:498px;
height:28px;
line-height: 28px;
text-indent: 20px;
position:absolute;
bottom:2px;
letter-spacing: 1px;
background-color: #fafafa;
}
.description .footer time {
color:#458b00;
}
.list .more {
width:200px;
height:50px;
line-height: 50px;
text-align: center;
margin:0 auto;
background: #fafafa;
border:1px solid #ccc;
border-radius: 5px;
cursor: pointer;
font-size: 18px;
color:#666;
margin-top:20px;
}
.ticket {
font-size:20px;
color:#666;
}
.ticket form h2 {
height:50px;
line-height: 50px;
font-size:40px;
font-weight: normal;
padding:5px 0 10px 0;
border-bottom:1px dashed #999;
}
.ticket form .type{
margin:20px 0 10px 0;
}
.ticket form .type span {
display: block;
}
.ticket form .type strong {
padding:0 10px 0 10px;
margin:0 20px 0 10px;
color:#fff;
display: inline-block;
height:30px;
background: #458b00;
line-height:30px;
text-align: center;
border-radius: 4px;
}
.form input {
width:250px;
height:30px;
border:1px solid #ccc;
font-size:18px;
margin:0 0 0 12px;
padding:5px;
border-radius: 5px;
outline: none;
}
.form {
line-height: 3;
}
.ticket form .left {
display:inline-block;
width:43%;
}
.ticket form .center {
display:inline-block;
width:43%;
}
.ticket form .right {
display:inline-block;
width:9%;
}
.ticket form .right .submit {
height:90px;
width:90px;
text-align: center;
line-height: 90px;
background: #f60;
border:0;
position:relative;
top: -25px;
color:#fff;
font-size: 18px;
letter-spacing: 2px;
border-radius: 5px;
}
.list_news {
color:#666;
}
.list_news h2{
height:50px;
line-height: 50px;
font-size:40px;
font-weight: normal;
padding:5px 0 10px 0;
border-bottom:1px dashed #999;
}
.list_news ul {
margin:10px 0 20px 0;
}
.list_news ul li {
display: inline-block;
width:50px;
height:30px;
line-height: 30px;
}
.list_news ul li:first-child {
width:120px;
height:30px;
}
.list_news ul li:nth-child(2) a {
margin-left:-5px;
background: #458b00;
color:#fff;
border-radius: 3px;
}
.list_news ul li a {
display: block;
padding:0 5px 0 5px;
color:#666;
}
.list_news table {
border:1px solid #ccc;
border-collapse: collapse;
width:100%;
text-align: center;
}
.list_news table tr:nth-child(2n) {
background: #fafafa;
}
.list_news table tr:hover{
background: #eee;
}
.list_news table th,.list_news table td {
border-bottom:1px solid #ccc;
height:50px;
}
.list_news table td.price{
color:#f60;
}
.list_news table td .reserve {
display: inline-block;
height:35px;
width:80px;
text-align: center;
line-height: 35px;
background: #f60;
border-radius:4px;
color:#fff;
}
.list_news table td .ticket_more {
color:#666;
}
.list{
color:#666;
}
.list h2{
font-size: 45px;
margin-bottom:10px;
color:#666;
font-weight: normal;
border-bottom: 1px dashed #ccc;
padding:0 0 15px 0;
}
.scenery figure {
padding:4px;
text-align: center;
width:433px;
border:1px solid #ccc;
display: inline-block;
margin: 10px 3px 15px 0 ;
border-radius: 5px;
letter-spacing: 1px;
}
.scenery figure img{
vertical-align:middle;
}
.scenery figcaption {
line-height: 1.5;
padding:10px 0 10px 0;
font-size: 16px;
}
.about p{
text-indent:2em;
line-height: 2;
margin:20px 0;
}
.about .address{
margin:60px 0 0 0;
}
.about .address address{
font-style: normal;
line-height: 1.5;
font-size:18px;
margin-top:20px;
}
================================================
FILE: css/style.css
================================================
@charset "utf-8";
.search {
width:100%;
min-width:1263px;
background: url(../img/search.jpg) no-repeat center;
height:600px;
position: relative;
}
.search .center {
width:600px;
height:50px;
background: #000;
position: absolute;
top:50%;
left:50%;
margin:-25px 0px 0px -300px;
border-radius:10px;
opacity: 0.6;
}
.input {
width:410px;
height:32px;
position: absolute;
top:50%;
left:50%;
margin:-20px 0px 0px -296px;
border-radius:10px;
background: #eee;
outline: none;
padding:4px;
font-size: 16px;
font-weight: bolder;
color:#666;
}
.button {
width: 140px;
height: 40px;
background: #fff;
position: absolute;
top: 50%;
left: 50%;
margin: -20px 0px 0px 140px;
border-radius: 10px;
background: #eee;
line-height: 40px;
text-align: center;
color:#666;
font-weight: bolder;
font-size: 24px;
cursor: pointer;
}
.tour {
width:1263px;
/* background: #000;*/
height:1150px;
color:#666;
margin:20px auto 0 auto;
padding-top:20px;
}
.news {
text-align: center;
}
.tour h2{
font-size: 45px;
margin-bottom:10px;
}
.news p{
margin-bottom: 10px;
margin-top:20px;
}
.tour figure {
position: relative;
padding:4px;
text-align: center;
width:380px;
border:1px solid #ccc;
display: inline-block;
margin:12px;
border-radius: 5px;
letter-spacing: 1px;
}
.tour figure img{
vertical-align:middle;
}
.tour .title {
font-weight: normal;
color:#333;
}
.tour figcaption {
text-align: left;
line-height: 1.5;
}
.sat{
font-weight: normal;
float:right;
font-style: normal;
margin:6px;
color:#999;
font-size:13px;
}
.price {
color:#f60;
font-size: 20px;
}
.type {
position:absolute;
left:4px;
top:4px;
width:80px;
height:20px;
background: #59b200;
line-height: 20px;
text-align: center;
font-size:14px;
color:#fff;
}
================================================
FILE: index.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>首页--旅游网站</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/basic.css">
</head>
<body>
<header>
<nav id="nav">
<div id="logo"><img src="img/logo.png" alt=""></div>
<ul>
<li class="active"><a href="index.html">首页</a></li>
<li><a href="informations.html">旅游资讯</a></li>
<li><a href="ticket.html">机票订购</a></li>
<li><a href="scenery.html">风景欣赏</a></li>
<li><a href="about.html">公司简介</a></li>
</ul>
</nav>
</header>
<div class="search">
<div class="center"></div>
<input class="input" type="text" placeholder="请输入陆游景点或城市">
<div class="button">搜索</div>
</div>
<div class="tour">
<section class="news">
<h2>热门旅游</h2>
<p>国内旅游、国外旅游、自助旅游、自驾旅游、油轮签证、主题旅游等各种最新热门旅游推荐</p>
</section>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="img/tour1.jpg" alt="">
<figcaption>
<strong class="title"> <曼谷-芭提雅6日游></strong> 包团特惠,超丰富景点,升级1晚国五,无自费,更赠送600元/成人自费券
<div class="info">
<em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
</div>
<footer id="footer">
<div class="top">
<div class="block left">
<h3>合作伙伴</h3>
<hr>
<ul>
<li>途牛旅游网</li>
<li>驴妈妈旅游网</li>
<li>携程旅游</li>
<li>中国去青年旅行社</li>
</ul>
</div>
<div class="block middle">
<h3>旅游FAQ</h3>
<hr>
<ul>
<li>旅游合同签订方式?</li>
<li>儿童价是基于什么制定的?</li>
<li>旅游的线路品质怎么界定的?</li>
<li>单房差是什么?</li>
<li>旅游保险有那些种类?</li>
</ul>
</div>
<div class="block right">
<h3>联系方式</h3>
<hr>
<ul>
<li>微博:weibo.com/xuehua</li>
<li>邮件:xuehua@xuehua.com</li>
<li>地址:江苏盐城无名路123 号</li>
</ul>
</div>
</div>
<div class="bottom">Copyright © XUEHUA 雪花旅行社| 苏ICP 备120110119 号| 旅行社经营许可证:L-YC-BK12345</div>
</footer>
</body>
</html>
================================================
FILE: informations.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>旅游资讯--旅游网站</title>
<link rel="stylesheet" href="css/column.css">
<link rel="stylesheet" href="css/basic.css">
</head>
<body>
<header>
<nav id="nav">
<div id="logo"><img src="img/logo.png" alt=""></div>
<ul>
<li><a href="index.html">首页</a></li>
<li class="active"><a href="informations.html">旅游资讯</a></li>
<li><a href="ticket.html">机票订购</a></li>
<li><a href="scenery.html">风景欣赏</a></li>
<li><a href="about.html">公司简介</a></li>
</ul>
</nav>
</header>
<div id="headline">
<div class="headline">
<hgroup>
<h2>旅游资讯</h2>
<p>介绍各种最新旅游信息、资讯要闻、景点攻略等</p>
</hgroup>
</div>
</div>
<div id="container">
<article class="list information">
<div class="infos">
<ul class="infos_left">
<li><a href="">限时特价</a></li>
<li><a href="">热门折扣</a></li>
</ul>
<ul class="infos_right">
<li><a href="" class="selected">推荐</a></li>
<li><a href="">折扣</a></li>
<li><a href="">价格</a></li>
</ul>
</div>
<figure class="tour">
<img src="img/tour1.jpg" alt="">
<figcation class="description">
<h3>曼谷-芭提雅6日游</h3>
<p>包团特惠,超丰富景点,升级1 晚国五,无自费,赠送600元成人券...</p>
<ol>
<li><mark>交通</mark>:春秋航空,杭州出发,无需转机</li>
<li><mark>团期</mark>:11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>2864</strong> <s>¥3980</s></div>
<div class="reserve"><a href="">立即抢购</a></div>
</div>
<div class="type">国内长线</div>
<div class="disc"><span>4.7折</span></div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于<time>2015-10-10</time></div>
</figcation>
</figure>
<figure class="tour">
<img src="img/tour2.jpg" alt="马尔代夫6日自助游">
<figcation class="description">
<h3>马尔代夫6日自助游</h3>
<p>双鱼岛Olhuveli4晚,上海出发,机+酒 包含:早晚餐+快艇 </p>
<ol>
<li>
<mark>交通</mark>春秋航空,杭州出发,无需转机</li>
<li>
<mark>团期</mark>11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>8039</strong> <s>¥9980</s>
</div>
<div class="reserve"><a href="###">立即抢购</a>
</div>
</div>
<div class="type">出境长线</div>
<div class="disc"><span>7.7折</span>
</div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于
<time>2015-10-10</time>
</div>
</figcation>
</figure>
<figure class="tour">
<img src="img/tour3.jpg" alt="海南双飞5日游">
<figcation class="description">
<h3>海南双飞5日游</h3>
<p>含盐城接送,全程挂牌四星酒店,一价全含,零自费“自费项目”免费送 </p>
<ol>
<li>
<mark>交通</mark>春秋航空,杭州出发,无需转机</li>
<li>
<mark>团期</mark>11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>2709</strong> <s>¥3280</s>
</div>
<div class="reserve"><a href="###">立即抢购</a>
</div>
</div>
<div class="type">自助旅游</div>
<div class="disc"><span>6.5折</span>
</div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于
<time>2015-10-10</time>
</div>
</figcation>
</figure>
<figure class="tour">
<img src="img/tour4.jpg" alt="富山-大阪-东京8日游">
<figcation class="description">
<h3>富山-大阪-东京8日游</h3>
<p>暑期亲子,2天自由,无导游安排自费项目,全程不强迫购物 </p>
<ol>
<li>
<mark>交通</mark>春秋航空,杭州出发,无需转机</li>
<li>
<mark>团期</mark>11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>9499</strong> <s>¥9999</s>
</div>
<div class="reserve"><a href="###">立即抢购</a>
</div>
</div>
<div class="type">自助旅游</div>
<div class="disc"><span>8.8折</span>
</div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于
<time>2015-10-10</time>
</div>
</figcation>
</figure>
<figure class="tour">
<img src="img/tour5.jpg" alt="法瑞意德12日游">
<figcation class="description">
<h3>法瑞意德12日游</h3>
<p>4至5星,金色列车,少女峰,部分THE MALL </p>
<ol>
<li>
<mark>交通</mark>春秋航空,杭州出发,无需转机</li>
<li>
<mark>团期</mark>11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>9199</strong> <s>¥9999</s>
</div>
<div class="reserve"><a href="###">立即抢购</a>
</div>
</div>
<div class="type">国内短线</div>
<div class="disc"><span>9.2折</span>
</div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于
<time>2015-10-10</time>
</div>
</figcation>
</figure>
<figure class="tour">
<img src="img/tour6.jpg" alt="巴厘岛6日半自助游">
<figcation class="description">
<h3>巴厘岛6日半自助游</h3>
<p>蓝梦出海,独栋别墅,悦榕庄下午茶,纯玩 </p>
<ol>
<li>
<mark>交通</mark>春秋航空,杭州出发,无需转机</li>
<li>
<mark>团期</mark>11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>6488</strong> <s>¥8460</s>
</div>
<div class="reserve"><a href="###">立即抢购</a>
</div>
</div>
<div class="type">国内短线</div>
<div class="disc"><span>7.6折</span>
</div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于
<time>2015-10-10</time>
</div>
</figcation>
</figure>
<figure class="tour">
<img src="img/tour7.jpg" alt="塞舌尔迪拜9日自助游">
<figcation class="description">
<h3>塞舌尔迪拜9日自助游</h3>
<p>一游两国,4晚塞舌尔,2晚迪拜,香港EK往返 </p>
<ol>
<li>
<mark>交通</mark>春秋航空,杭州出发,无需转机</li>
<li>
<mark>团期</mark>11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>9669</strong> <s>¥9999</s>
</div>
<div class="reserve"><a href="###">立即抢购</a>
</div>
</div>
<div class="type">游轮观光</div>
<div class="disc"><span>9.6折</span>
</div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于
<time>2015-10-10</time>
</div>
</figcation>
</figure>
<figure class="tour">
<img src="img/tour8.jpg" alt="花样姐姐土耳其9日游">
<figcation class="description">
<h3>花样姐姐土耳其9日游</h3>
<p>最高立减3000!中餐六菜一汤+土耳其当地美食满足您挑剔味蕾 </p>
<ol>
<li>
<mark>交通</mark>春秋航空,杭州出发,无需转机</li>
<li>
<mark>团期</mark>11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>9999</strong> <s>¥9999</s>
</div>
<div class="reserve"><a href="###">立即抢购</a>
</div>
</div>
<div class="type">出境长线</div>
<div class="disc"><span>10折</span>
</div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于
<time>2015-10-10</time>
</div>
</figcation>
</figure>
<figure class="tour">
<img src="img/tour9.jpg" alt="大阪-京都-箱根双飞6日游">
<figcation class="description">
<h3>大阪-京都-箱根双飞6日游</h3>
<p>盐城直飞,不走回头路,境外无自费,超值之旅 </p>
<ol>
<li>
<mark>交通</mark>春秋航空,杭州出发,无需转机</li>
<li>
<mark>团期</mark>11/01、11/03、11/08...</li>
</ol>
<div class="buy">
<div class="price">¥<strong>5284</strong> <s>¥8437</s>
</div>
<div class="reserve"><a href="###">立即抢购</a>
</div>
</div>
<div class="type">国内短线</div>
<div class="disc"><span>6.8折</span>
</div>
<div class="footer">本团游由雪花旅行社赞助提供,截止于
<time>2015-10-10</time>
</div>
</figcation>
</figure>
<div class="more">加载更多...</div>
</article>
<aside class="sidebar">
<div class="recommend sidebox">
<h3>景点推荐</h3>
<div class="tag">
<ul>
<li><a href="###">曼谷(12)</a></li>
<li><a href="###">东京(5)</a></li>
<li><a href="###">西双版纳(8)</a></li>
<li><a href="###">漓江(16)</a></li>
<li><a href="###">呼伦贝尔(4)</a></li>
<li><a href="###">首尔(9)</a></li>
<li><a href="###">巴厘岛(15)</a></li>
<li><a href="###">土耳其(22)</a></li>
<li><a href="###">夏威夷(5)</a></li>
<li><a href="###">巴厘岛(11)</a></li>
<li><a href="###">毛里求斯(7)</a></li>
<li><a href="###">吉普岛(4)</a></li>
<li><a href="###">希腊(18)</a></li>
<li><a href="###">法瑞意(8)</a></li>
<li><a href="###">马尔代夫(9)</a></li>
<li><a href="###">新西兰(16)</a></li>
<li><a href="###">埃及(11)</a></li>
<li><a href="###">迪拜(14)</a></li>
<li><a href="###">斯里兰卡(7)</a></li>
<li><a href="###">麦哈顿(3)</a></li>
<li><a href="###">大阪(15)</a></li>
</ul>
</div>
</div>
<div class="hot sidebox">
<h3>热门旅游</h3>
<div class="figure">
<figure>
<img src="img/hot1.jpg" alt="曼谷-芭提雅6日游">
<figcaption>曼谷-芭提雅6日游</figcaption>
</figure>
<figure>
<img src="img/hot2.jpg" alt="马尔代夫双鱼6日游">
<figcaption>马尔代夫双鱼6日游</figcaption>
</figure>
<figure>
<img src="img/hot3.jpg" alt="海南双飞5日游">
<figcaption>海南双飞5日游</figcaption>
</figure>
<figure>
<img src="img/hot4.jpg" alt="富山大阪东京8日游">
<figcaption>富山大阪东京8日游</figcaption>
</div>
</div>
<div class="treasure sidebox">
<h3>旅游百宝箱</h3>
<div class="box">
<a href="" class="trea1">天气预报</a>
<a href="" class="trea2">火车票查询</a>
<a href="" class="trea3">航空查询</a>
<a href="" class="trea4">地铁线路查询</a>
</div>
</div>
</aside>
</div>
<footer id="footer">
<div class="top">
<div class="block left">
<h3>合作伙伴</h3>
<hr>
<ul>
<li>途牛旅游网</li>
<li>驴妈妈旅游网</li>
<li>携程旅游</li>
<li>中国去青年旅行社</li>
</ul>
</div>
<div class="block middle">
<h3>旅游FAQ</h3>
<hr>
<ul>
<li>旅游合同签订方式?</li>
<li>儿童价是基于什么制定的?</li>
<li>旅游的线路品质怎么界定的?</li>
<li>单房差是什么?</li>
<li>旅游保险有那些种类?</li>
</ul>
</div>
<div class="block right">
<h3>联系方式</h3>
<hr>
<ul>
<li>微博:weibo.com/xuehua</li>
<li>邮件:xuehua@xuehua.com</li>
<li>地址:江苏盐城无名路123 号</li>
</ul>
</div>
</div>
<div class="bottom">Copyright © XUEHUA 雪花旅行社| 苏ICP 备120110119 号| 旅行社经营许可证:L-YC-BK12345</div>
</footer>
</body>
</html>
================================================
FILE: scenery.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>风景欣赏--旅游网站</title>
<link rel="stylesheet" href="css/column.css">
<link rel="stylesheet" href="css/basic.css">
</head>
<body>
<header>
<nav id="nav">
<div id="logo"><img src="img/logo.png" alt=""></div>
<ul>
<li><a href="index.html">首页</a></li>
<li><a href="informations.html">旅游资讯</a></li>
<li><a href="ticket.html">机票订购</a></li>
<li class="active"><a href="scenery.html">风景欣赏</a></li>
<li><a href="about.html">公司简介</a></li>
</ul>
</nav>
</header>
<div id="headline">
<div class="headline">
<hgroup>
<h2>旅游资讯</h2>
<p>介绍各种最新旅游信息、资讯要闻、景点攻略等</p>
</hgroup>
</div>
</div>
<div id="container">
<article class="list scenery">
<section>
<h2>热门旅游</h2>
<figure>
<img src="img/s1.jpg" alt="">
<figcaption>曼谷-芭提雅6日游[共12张]</figcaption>
</figure>
<figure>
<img src="img/s2.jpg" alt="马尔代夫双鱼岛">
<figcaption>马尔代夫双鱼岛[共12张]</figcaption>
</figure>
<figure>
<img src="img/s3.jpg" alt="海南">
<figcaption>海南[共19 张]</figcaption>
</figure>
<figure>
<img src="img/s4.jpg" alt="富山-大阪-东京">
<figcaption>富山-大阪-东京[共22张]</figcaption>
</figure>
<figure>
<img src="img/s5.jpg" alt="法瑞意德">
<figcaption>法瑞意德[共31张]</figcaption>
</figure>
<figure>
<img src="img/s6.jpg" alt="巴厘岛">
<figcaption>巴厘岛[共12张]</figcaption>
</figure>
<figure>
<img src="img/s7.jpg" alt="塞舌尔迪拜">
<figcaption>塞舌尔迪拜[共7张]</figcaption>
</figure>
<figure>
<img src="img/s8.jpg" alt="花样姐姐土耳其">
<figcaption>花样姐姐土耳其[共14张]</figcaption>
</figure>
<div class="more">加载更多...</div>
</section>
</article>
<aside class="sidebar">
<div class="recommend sidebox">
<h3>景点推荐</h3>
<div class="tag">
<ul>
<li><a href="###">曼谷(12)</a></li>
<li><a href="###">东京(5)</a></li>
<li><a href="###">西双版纳(8)</a></li>
<li><a href="###">漓江(16)</a></li>
<li><a href="###">呼伦贝尔(4)</a></li>
<li><a href="###">首尔(9)</a></li>
<li><a href="###">巴厘岛(15)</a></li>
<li><a href="###">土耳其(22)</a></li>
<li><a href="###">夏威夷(5)</a></li>
<li><a href="###">巴厘岛(11)</a></li>
<li><a href="###">毛里求斯(7)</a></li>
<li><a href="###">吉普岛(4)</a></li>
<li><a href="###">希腊(18)</a></li>
<li><a href="###">法瑞意(8)</a></li>
<li><a href="###">马尔代夫(9)</a></li>
<li><a href="###">新西兰(16)</a></li>
<li><a href="###">埃及(11)</a></li>
<li><a href="###">迪拜(14)</a></li>
<li><a href="###">斯里兰卡(7)</a></li>
<li><a href="###">麦哈顿(3)</a></li>
<li><a href="###">大阪(15)</a></li>
</ul>
</div>
</div>
<div class="hot sidebox">
<h3>热门旅游</h3>
<div class="figure">
<figure>
<img src="img/hot1.jpg" alt="曼谷-芭提雅6日游">
<figcaption>曼谷-芭提雅6日游</figcaption>
</figure>
<figure>
<img src="img/hot2.jpg" alt="马尔代夫双鱼6日游">
<figcaption>马尔代夫双鱼6日游</figcaption>
</figure>
<figure>
<img src="img/hot3.jpg" alt="海南双飞5日游">
<figcaption>海南双飞5日游</figcaption>
</figure>
<figure>
<img src="img/hot4.jpg" alt="富山大阪东京8日游">
<figcaption>富山大阪东京8日游</figcaption>
</div>
</div>
<div class="treasure sidebox">
<h3>旅游百宝箱</h3>
<div class="box">
<a href="" class="trea1">天气预报</a>
<a href="" class="trea2">火车票查询</a>
<a href="" class="trea3">航空查询</a>
<a href="" class="trea4">地铁线路查询</a>
</div>
</div>
</aside>
</div>
<footer id="footer">
<div class="top">
<div class="block left">
<h3>合作伙伴</h3>
<hr>
<ul>
<li>途牛旅游网</li>
<li>驴妈妈旅游网</li>
<li>携程旅游</li>
<li>中国去青年旅行社</li>
</ul>
</div>
<div class="block middle">
<h3>旅游FAQ</h3>
<hr>
<ul>
<li>旅游合同签订方式?</li>
<li>儿童价是基于什么制定的?</li>
<li>旅游的线路品质怎么界定的?</li>
<li>单房差是什么?</li>
<li>旅游保险有那些种类?</li>
</ul>
</div>
<div class="block right">
<h3>联系方式</h3>
<hr>
<ul>
<li>微博:weibo.com/xuehua</li>
<li>邮件:xuehua@xuehua.com</li>
<li>地址:江苏盐城无名路123 号</li>
</ul>
</div>
</div>
<div class="bottom">Copyright © XUEHUA 雪花旅行社| 苏ICP 备120110119 号| 旅行社经营许可证:L-YC-BK12345</div>
</footer>
</body>
</html>
================================================
FILE: ticket.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>机票预订--旅游网站</title>
<link rel="stylesheet" href="css/column.css">
<link rel="stylesheet" href="css/basic.css">
</head>
<body>
<header>
<nav id="nav">
<div id="logo"><img src="img/logo.png" alt=""></div>
<ul>
<li><a href="index.html">首页</a></li>
<li><a href="informations.html">旅游资讯</a></li>
<li class="active"><a href="ticket.html">机票订购</a></li>
<li><a href="scenery.html">风景欣赏</a></li>
<li><a href="about.html">公司简介</a></li>
</ul>
</nav>
</header>
<div id="headline">
<div class="headline">
<hgroup>
<h2>旅游资讯</h2>
<p>介绍各种最新旅游信息、资讯要闻、景点攻略等</p>
</hgroup>
</div>
</div>
<div id="container">
<article class="list ticket">
<form action="">
<h2>机票预订</h2>
<div class="type"><span>航班类型<strong>单程</strong>往返</span></div>
<div class="form left">
<p>
<lable for="from_city">出发城市</lable>
<input type="text" name="from_city" placeholder="城市名">
</p>
<p>
<lable>返回城市</lable>
<input type="text" placeholder="城市名">
</p>
</div>
<div class="form center">
<p>
<lable>出发时间</lable>
<input type="text" placeholder="时间/日期">
</p>
<p>
<lable>返回时间</lable>
<input type="text" placeholder="时间/日期">
</p>
</div>
<div class="form right">
<button type="button" class="submit">订票</button>
</div>
</form>
<div class="list_news">
<h2>最新机票</h2>
<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>
</ul>
<table>
<thead>
<tr>
<th>路线</th>
<th>日期</th>
<th>价格</th>
<th>税费</th>
<th>餐食</th>
<th>航班</th>
<th>预定</th>
</tr>
</thead>
<tbody>
<tr>
<td>北京-成都</td>
<td>10-15</td>
<td class="price">¥745</td>
<td>¥50</td>
<td>有</td>
<td>春秋航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-上海</td>
<td>10-15</td>
<td class="price">¥479</td>
<td>¥45</td>
<td>无</td>
<td>南方航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-深圳</td>
<td>10-15</td>
<td class="price">¥561</td>
<td>¥52</td>
<td>有</td>
<td>西部航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-杭州</td>
<td>10-15</td>
<td class="price">¥378</td>
<td>¥36</td>
<td>无</td>
<td>天津航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-广州</td>
<td>10-15</td>
<td class="price">¥612</td>
<td>¥44</td>
<td>有</td>
<td>首都航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-重庆</td>
<td>10-15</td>
<td class="price">¥428</td>
<td>¥62</td>
<td>有</td>
<td>东方航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-昆明</td>
<td>10-15</td>
<td class="price">¥509</td>
<td>¥35</td>
<td>无</td>
<td>厦门航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-厦门</td>
<td>10-15</td>
<td class="price">¥893</td>
<td>¥73</td>
<td>有</td>
<td>深圳航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-长沙</td>
<td>10-15</td>
<td class="price">¥663</td>
<td>¥46</td>
<td>无</td>
<td>四川航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="7"><a href="###" class="ticket_more">加载更多航班...</a>
</td>
</tr>
</tfoot>
</table>
</div>
</article>
<aside class="sidebar">
<div class="recommend sidebox">
<h3>景点推荐</h3>
<div class="tag">
<ul>
<li><a href="###">曼谷(12)</a></li>
<li><a href="###">东京(5)</a></li>
<li><a href="###">西双版纳(8)</a></li>
<li><a href="###">漓江(16)</a></li>
<li><a href="###">呼伦贝尔(4)</a></li>
<li><a href="###">首尔(9)</a></li>
<li><a href="###">巴厘岛(15)</a></li>
<li><a href="###">土耳其(22)</a></li>
<li><a href="###">夏威夷(5)</a></li>
<li><a href="###">巴厘岛(11)</a></li>
<li><a href="###">毛里求斯(7)</a></li>
<li><a href="###">吉普岛(4)</a></li>
<li><a href="###">希腊(18)</a></li>
<li><a href="###">法瑞意(8)</a></li>
<li><a href="###">马尔代夫(9)</a></li>
<li><a href="###">新西兰(16)</a></li>
<li><a href="###">埃及(11)</a></li>
<li><a href="###">迪拜(14)</a></li>
<li><a href="###">斯里兰卡(7)</a></li>
<li><a href="###">麦哈顿(3)</a></li>
<li><a href="###">大阪(15)</a></li>
</ul>
</div>
</div>
<div class="hot sidebox">
<h3>热门旅游</h3>
<div class="figure">
<figure>
<img src="img/hot1.jpg" alt="曼谷-芭提雅6日游">
<figcaption>曼谷-芭提雅6日游</figcaption>
</figure>
<figure>
<img src="img/hot2.jpg" alt="马尔代夫双鱼6日游">
<figcaption>马尔代夫双鱼6日游</figcaption>
</figure>
<figure>
<img src="img/hot3.jpg" alt="海南双飞5日游">
<figcaption>海南双飞5日游</figcaption>
</figure>
<figure>
<img src="img/hot4.jpg" alt="富山大阪东京8日游">
<figcaption>富山大阪东京8日游</figcaption>
</div>
</div>
<div class="treasure sidebox">
<h3>旅游百宝箱</h3>
<div class="box">
<a href="" class="trea1">天气预报</a>
<a href="" class="trea2">火车票查询</a>
<a href="" class="trea3">航空查询</a>
<a href="" class="trea4">地铁线路查询</a>
</div>
</div>
</aside>
</div>
<footer id="footer">
<div class="top">
<div class="block left">
<h3>合作伙伴</h3>
<hr>
<ul>
<li>途牛旅游网</li>
<li>驴妈妈旅游网</li>
<li>携程旅游</li>
<li>中国去青年旅行社</li>
</ul>
</div>
<div class="block middle">
<h3>旅游FAQ</h3>
<hr>
<ul>
<li>旅游合同签订方式?</li>
<li>儿童价是基于什么制定的?</li>
<li>旅游的线路品质怎么界定的?</li>
<li>单房差是什么?</li>
<li>旅游保险有那些种类?</li>
</ul>
</div>
<div class="block right">
<h3>联系方式</h3>
<hr>
<ul>
<li>微博:weibo.com/xuehua</li>
<li>邮件:xuehua@xuehua.com</li>
<li>地址:江苏盐城无名路123 号</li>
</ul>
</div>
</div>
<div class="bottom">Copyright © XUEHUA 雪花旅行社| 苏ICP 备120110119 号| 旅行社经营许可证:L-YC-BK12345</div>
</footer>
</body>
</html>
================================================
FILE: wap/README.md
================================================
# HTML5+CSS实现雪花旅行社(手机版)
================================================
FILE: wap/about.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0,
minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
<title>关于我们--旅游网站</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<nav id="nav">
<ul>
<li><a href="index.html">首页</a></li>
<li><a href="informations.html">资讯</a></li>
<li><a href="ticket.html">票务</a></li>
<li class="active"><a href="about.html">关于</a></li>
</ul>
</nav>
</header>
<div id="headline">
<hgroup>
<h2>公司简介</h2>
<h3>公司的发展历程,获得荣誉以及联系方式</h3>
</hgroup>
</div>
<article class="list about">
<section>
<h2>关于我们</h2>
<p>瓢城旅行社旅游网创立于2006 年10 月,以“让旅游更简单”为使命,为消费者提供由北京、上海、广州、深圳等64 个城市出发的旅游产品预订服务,产品全面,价格透明,全年365 天24 小时400 电话预订,并提供丰富的后续服务和保障。 目前,瓢城旅行社旅游网提供8 万余种旅游产品供消费者选择,涵盖跟团、自助、自驾、邮轮、酒店、签证、景区门票以及公司旅游等,已成功服务累计超过400 万人次出游。 同时基于瓢城旅行社旅游网全球中文景点目录以及中文旅游社区,可以更好地帮助游客了解目的地信息,妥善制定好出游计划,并方便地预订旅程中的服务项目。
</p>
</section>
<section class="address">
<h2>联系方式</h2>
<address>
<ul>
<li>瓢城旅行社股份有限公司</li>
<li>地址:江苏省盐城市亭湖区大庆中路1234 号</li>
<li>邮编:1234567</li>
<li>电话:010-88888888</li>
<li>传真:010-88666666</li>
</ul>
</address>
</section>
</article>
<footer id="footer">
<div class="top">
<ul>
<li><a href="">客户端</a></li>
<li><a href="">触屏版</a></li>
<li><a href="">电脑版</a></li>
</ul>
</div>
<div class="bottom">Copyright © YCKU 瓢城旅行社| 苏ICP 备120110119 号</div>
</footer>
</body>
</html>
================================================
FILE: wap/css/style.css
================================================
@charset "utf-8";
html {
font-size: 625%;
}
body,
ul,
ol,
li,
h2,
h3,
h4,
p,
hr,
figure,
hgroup {
padding: 0;
margin: 0;
}
body {
font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei UI", "Microsoft YaHei", SimHei, "宋体", simsun, sans-serif;
font-size: 0.16em;
}
ol,
ul,
li {
list-style: none;
}
a {
text-decoration: none;
}
/*div,figure,figcaption {
box-sizing: border-box;
}*/
img {
display: block;
max-width: 100%;
}
.none {
display: none;
}
.clearfix:after {
content: '.';
display: block;
clear: both;
height: 0;
visibility: hidden;
}
header {
width: 100%;
height: 0.7rem;
background: #333;
/* box-shadow: 0 1px 10px rgba(0, 0, 0, 0.3);*/
line-height: 0.7rem;
position: fixed;
top: 0;
z-index: 999;
}
nav ul {
line-height: 0.7rem;
text-align: center;
overflow: hidden;
}
nav ul li {
float: left;
width: calc(100%/4);
}
nav ul li a {
display: block;
color: #eee;
}
nav ul li a:hover,
.active a {
list-style: none;
display: block;
background: #000;
}
.adver {
max-width: 6.4rem;
margin: 0 auto;
padding: .7rem 0 0 0;
}
.adver img {
max-width: 100%;
display: block;
}
.search {
max-width: 6.4rem;
height: .40rem;
margin: 0 auto;
position: relative;
background: #ddd;
padding: 0.03rem 0 0 0;
}
.input {
display: block;
width: 95%;
height: 0.27rem;
background: #fff;
outline: none;
font-size: 0.16rem;
color: #666;
border-radius: .04rem;
margin: 0 auto;
padding: 0.05rem;
border: 0;
}
.button {
width: .6rem;
height: .38rem;
display: block;
cursor: pointer;
margin: 0 auto;
border-radius: 0.04rem;
position: absolute;
right: 1%;
top: 0.02rem;
background: #eee;
text-align: center;
line-height: .38rem;
}
#footer {
position: fixed;
bottom: 0;
width: 100%;
height: 0.7rem;
background: #222;
clear: both;
font-size: 0.12rem;
color: #fff;
}
.top {
height: 0.3rem;
line-height: 0.3rem;
max-width: 6.4rem;
margin: 0 auto;
text-align: center;
}
.top ul {
width: 80%;
margin: 0 auto;
}
.top ul li {
width: 33%;
height: 0.3rem;
line-height: 0.3rem;
float: left;
}
.top ul li a {
color: #fff;
}
.bottom {
height: 0.3rem;
line-height: 0.3rem;
color: #fff;
text-align: center;
line-height: 0.25rem;
}
#tour {
max-width: 6.4rem;
margin: 0 auto;
}
#tour {
max-width: 6.4rem;
margin: 0 auto;
}
hgroup {
text-align: center;
}
hgroup h2 {
font-size: 0.24rem;
padding: 0.05rem 0;
}
hgroup h3 {
font-size: 0.18rem;
padding: 0.05rem 0;
}
.container {
max-width: 6.4rem;
margin: 0 auto 1.1rem auto;
overflow: hidden;
}
.container figure {
width: 45%;
float: left;
padding: 0 0.08rem 0 0.08rem;
}
.container figure img {
max-width: 100%;
display: block;
padding: 0.05rem;
}
.container figcaption {
font-size: 0.12rem;
}
.container figcaption h4 {
font-size: 0.14rem;
font-weight: normal;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.container figcaption p {
font-size: 0.14rem;
font-weight: normal;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.container figcaption .info {
font-size: 0.16rem;
font-weight: normal;
margin: 0.2rem 0 0 0;
letter-spacing: 0.01rem;
}
.sat {
font-weight: normal;
float: right;
font-style: normal;
margin: 0.06rem;
color: #999;
font-size: 0.12rem;
}
.price {
color: #f60;
font-size: 0.16rem;
}
#headline {
max-width: 6.4rem;
margin: 0 auto .2rem auto;
padding: .5rem 0 0 0;
position: relative;
top: .2rem;
background: linear-gradient(to right bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0)), url(../img/bg1.png) no-repeat center;
height: 1.25rem;
}
#headline img {
display: block;
max-width: 100%;
}
#headline hgroup {
max-width: 6.4rem;
margin: .2rem auto;
position: absolute;
top: 35%;
text-align: left;
padding: 0 0 0 .25rem;
color: #fff;
}
#headline hgroup h2 {
font-size: .16rem;
font-weight: normal;
}
#headline hgroup h3 {
font-size: .14rem;
font-weight: normal;
}
.list {
max-width: 6.4rem;
margin: 0 auto 1.1rem auto;
overflow: hidden;
padding: .15rem 0.2rem .1rem;
color: #666;
}
.list h2 {
font-size: .16rem;
border-bottom: 0.01rem dashed #999;
padding: 0 0 .15rem 0;
}
.list figure {
width: 99%;
padding: 0.2rem 0.08rem 0 0.08rem;
float: left;
position: relative;
}
.list figure img {
width: 50%;
padding: 0.05rem;
float: left;
}
.list figcaption {
width: 45%;
display: block;
font-size: 0.12rem;
float: right;
}
.list figcaption h3 {
font-size: 0.14rem;
}
.list figcaption h4 {
font-size: 0.12rem;
font-weight: normal;
line-height: .20rem;
}
.infos hgroup {
text-align: left;
padding: 0 0 0 .04rem;
}
.infos .price {
padding: .1rem 0 0 .1rem;
}
.infos .price strong {
color: #f60;
font-size: .36rem;
}
.ticket {
font-size: .2rem;
color: #666;
}
.ticket form .type {
margin: .2rem 0 .1rem 0;
font-size: .16rem;
}
.ticket form .type span {
display: block;
font-size: .16rem;
}
.ticket form .type strong {
padding: 0 .1rem 0 .1rem;
margin: 0 .1rem 0 .1rem;
color: #fff;
display: inline-block;
height: .3rem;
background: #458b00;
line-height: .3rem;
text-align: center;
border-radius: .04rem;
font-size: .16rem;
}
.form input {
width: 90%;
height: .3rem;
border: .01rem solid #ccc;
font-size: .16rem margin:0 0 0 .1rem;
padding: .05rem;
border-radius: .05rem;
outline: none;
}
.form {
line-height: 1.2
}
.form p label {
padding: 0 0 0.05rem 0;
display: block;
}
.form p {
height: 1rem;
}
.ticket form .left {
width: 95%;
}
.ticket form .center {
width: 95%;
}
.ticket form .right {
width: 95%;
}
.ticket form .right .center {
height: 50%;
width: 1rem;
margin: 0 auto;
}
.ticket form .right .submit {
height: 0.3rem;
width: 0.6rem;
text-align: center;
line-height: .3rem;
background: #f60;
border: 0;
color: #fff;
font-size: .14rem;
letter-spacing: .02rem;
border-radius: .05rem;
margin: 0 auto;
}
.list_news {
color: #666;
margin-top: .2rem;
}
.list_news ul {
margin: .1rem 0 .2rem 0;
font-size: .14rem;
}
.list_news ul li {
display: inline-block;
width: .5rem;
height: .3rem;
line-height: .3rem;
text-align: center;
}
.list_news ul li:first-child {
width: 1.2rem;
height: 0.3rem;
text-align: left;
}
.list_news ul li:nth-child(2) a {
margin-left: -.2rem;
background: #458b00;
color: #fff;
border-radius: .03rempx;
}
.list_news ul li a {
display: block;
padding: 0 .05rem 0 .05rem;
color: #666;
}
.list_news table {
border: 0.01rem solid #ccc;
border-collapse: collapse;
width: 100%;
text-align: center;
font-size: 0.13rem;
}
.list_news table tr:nth-child(2n) {
background: #fafafa;
}
.list_news table tr:hover {
background: #eee;
}
.list_news table th,
.list_news table td {
border-bottom: 0.01rem solid #ccc;
height: 0.5rem;
}
.list_news table td.price {
color: #f60;
}
.list_news table td .reserve {
display: inline-block;
height: 0.2rem;
width: 0.4rem;
text-align: center;
line-height: 0.2rem;
background: #f60;
border-radius: 0.01rem;
color: #fff;
}
.list_news table td .ticket_more {
color: #666;
}
.about p {
text-indent: 2em;
line-height: 2;
margin: .2rem 0;
}
.about .address {
margin: .6rem 0 0 0;
}
.about .address address {
font-style: normal;
line-height: 1.5;
font-size: .18rem;
margin-top: .2rem;
}
================================================
FILE: wap/index.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0,
minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
<title>旅游网站</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<nav id="nav">
<ul>
<li class="active"><a href="index.html">首页</a></li>
<li><a href="informations.html">资讯</a></li>
<li><a href="ticket.html">票务</a></li>
<li><a href="about.html">关于</a></li>
</ul>
</nav>
</header>
<div class="adver"><img src="img/bg.png" alt=""></div>
<div class="search">
<input class="input" type="text" placeholder="请输入陆游景点或城市">
<div class="button">搜索</div>
</div>
<div id="tour">
<hgroup>
<h2>热门旅游</h2>
<h3>最新的各种旅游资讯推荐!</h3>
</hgroup>
<div class="container">
<figure>
<img src="img/tour1.png" alt="">
<figcaption>
<h4><曼谷-芭提雅6 日游></h4>
<p>包团特惠,超丰富景点</p>
<div class="info"> <em class="sat">满意度 77%</em>
<span class="price">¥ <strong>2864</strong> 起</span>
</div>
</figcaption>
</figure>
<figure>
<img src="img/tour2.png" alt="">
<figcaption>
<h4><马尔代夫双鱼岛Olhuveli4 晚6 日自助游></h4>
<p>上海出发,机+酒包含:早晚餐+快艇</p>
<div class="info"> <em class="sat">满意度 97%</em>
<span class="price">¥ <strong>8039</strong> 起</span>
</div>
</figcaption>
</figure>
<figure>
<img src="img/tour3.png" alt="">
<figcaption>
<h4><海南双飞5 日游></h4>
<p>含盐城接送,全程挂牌四星酒店</p>
<div class="info"> <em class="sat">满意度90%</em>
<span class="price">¥ <strong>2709</strong> 起</span>
</div>
</figcaption>
</figure>
<figure>
<img src="img/tour4.png" alt="">
<figcaption>
<h4><富山-大阪-东京8 日游></h4>
<p>暑期亲子,2 天自由,无导游安排</p>
<div class="info"> <em class="sat">满意度97%</em>
<span class="price">¥ <strong>9499</strong> 起</span>
</div>
</figcaption>
</figure>
<figure>
<img src="img/tour5.png" alt="">
<figcaption>
<h4><法瑞意德12 日游></h4>
<p>4 至5 星,金色列车,少女峰</p>
<div class="info"> <em class="sat">满意度97%</em>
<span class="price">¥ <strong>9199</strong> 起</span>
</div>
</figcaption>
</figure>
<figure>
<img src="img/tour6.png" alt="">
<figcaption>
<h4><巴厘岛6 日半自助游></h4>
<p>蓝梦出海,独栋别墅,悦榕庄下午茶</p>
<div class="info"> <em class="sat">满意度95%</em>
<span class="price">¥ <strong>6488</strong> 起</span>
</div>
</figcaption>
</figure>
<figure>
<img src="img/tour7.png" alt="">
<figcaption>
<h4><塞舌尔迪拜9 日自助游></h4>
<p>一游两国,4 晚塞舌尔,2 晚迪拜</p>
<div class="info"> <em class="sat">满意度100%</em>
<span class="price">¥ <strong>9669</strong> 起</span>
</div>
</figcaption>
</figure>
<figure>
<img src="img/tour8.png" alt="">
<figcaption>
<h4><花样姐姐土耳其9 日或10 日游></h4>
<p>最高立减3000!中餐六菜一汤</p>
<div class="info"> <em class="sat">满意度93%</em>
<span class="price">¥ <strong>9999</strong> 起</span>
</div>
</figcaption>
</figure>
</div>
<div class="clearfix"></div>
</div>
<footer id="footer">
<div class="top">
<ul>
<li><a href="">客户端</a></li>
<li><a href="">触屏版</a></li>
<li><a href="">电脑版</a></li>
</ul>
</div>
<div class="bottom">Copyright © YCKU 瓢城旅行社| 苏ICP 备120110119 号</div>
</footer>
</body>
</html>
================================================
FILE: wap/informations.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0,
minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
<title>旅游资讯--旅游网站</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<nav id="nav">
<ul>
<li><a href="index.html">首页</a></li>
<li class="active"><a href="informations.html">资讯</a></li>
<li><a href="ticket.html">票务</a></li>
<li><a href="about.html">关于</a></li>
</ul>
</nav>
</header>
<div id="headline">
<hgroup>
<h2>旅游资讯</h2>
<h3>介绍各种最新旅游信息、资讯要闻、景点攻略等</h3>
</hgroup>
</div>
<div class="list infos">
<h2>热门旅游</h2>
<figure>
<img src="img/tour1.png" alt="">
<figcaption>
<hgroup>
<h3 class="title">曼谷-芭提雅6日游</h3>
<h4 class="small_title">包团特惠,超丰富景点,升级1 晚国五,无自费,赠送600 元</h4>
</hgroup>
<div class="price">¥<strong>2864</strong></div>
</figcaption>
</figure>
<figure>
<img src="img/tour2.png" alt="">
<figcaption>
<hgroup>
<h3 class="title">马尔代夫6日自助游</h3>
<h4 class="small_title">双鱼岛Olhuveli4晚,上海出发,机+酒 包含:早晚餐+快艇...</h4>
</hgroup>
<div class="price">¥<strong>8039</strong></div>
</figcaption>
</figure>
<figure>
<img src="img/tour3.png" alt="">
<figcaption>
<hgroup>
<h3 class="title">海南双飞5日游</h3>
<h4 class="small_title">含盐城接送,全程挂牌四星酒店,一价全含,零自费“自费项目”...</h4>
</hgroup>
<div class="price">¥<strong>2709</strong></div>
</figcaption>
</figure>
<figure>
<img src="img/tour4.png" alt="">
<figcaption>
<hgroup>
<h3 class="title">富山-大阪-东京8日游</h3>
<h4 class="small_title">暑期亲子,2天自由,无导游安排自费项目,全程不强迫购物...</h4>
</hgroup>
<div class="price">¥<strong>9499</strong></div>
</figcaption>
</figure>
<figure>
<img src="img/tour5.png" alt="">
<figcaption>
<hgroup>
<h3 class="title">法瑞意德12日游</h3>
<h4 class="small_title">4至5星,金色列车,少女峰,部分THE MALL...</h4>
</hgroup>
<div class="price">¥<strong>9199</strong></div>
</figcaption>
</figure>
<figure>
<img src="img/tour6.png" alt="">
<figcaption>
<hgroup>
<h3 class="title">巴厘岛6日半自助游</h3>
<h4 class="small_title">蓝梦出海,独栋别墅,悦榕庄下午茶,纯玩...</h4>
</hgroup>
<div class="price">¥<strong>6488</strong></div>
</figcaption>
<br style="clear:both">
</figure>
<figure>
<img src="img/tour7.png" alt="">
<figcaption>
<hgroup>
<h3 class="title">塞舌尔迪拜9日自助游</h3>
<h4 class="small_title">一游两国,4晚塞舌尔,2晚迪拜,香港EK往返...</h4>
</hgroup>
<div class="price">¥<strong>9669</strong></div>
</figcaption>
</figure>
<figure>
<img src="img/tour8.png" alt="">
<figcaption>
<hgroup>
<h3 class="title">花样姐姐土耳其9日游</h3>
<h4 class="small_title">最高立减3000!中餐六菜一汤+土耳其当地美食满足您挑剔味蕾...</h4>
</hgroup>
<div class="price">¥<strong>9999</strong></div>
</figcaption>
</figure>
</div>
<footer id="footer">
<div class="top">
<ul>
<li><a href="">客户端</a></li>
<li><a href="">触屏版</a></li>
<li><a href="">电脑版</a></li>
</ul>
</div>
<div class="bottom">Copyright © YCKU 瓢城旅行社| 苏ICP 备120110119 号</div>
</footer>
</body>
</html>
================================================
FILE: wap/ticket.html
================================================
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0,
minimum-scale=1.0, maximum-scale=1.0,user-scalabel=no">
<title>机票预订--旅游网站</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<nav id="nav">
<ul>
<li><a href="index.html">首页</a></li>
<li><a href="informations.html">资讯</a></li>
<li class="active"><a href="ticket.html">票务</a></li>
<li><a href="about.html">关于</a></li>
</ul>
</nav>
</header>
<div id="headline">
<hgroup>
<h2>票务预订</h2>
<h3>各种飞机票、火车票、汽车票和轮渡票的订购服务</h3>
</hgroup>
</div>
<div class="list ticket">
<h2>机票预订</h2>
<form action="">
<div class="type"><span>航班类型<strong>单程</strong>往返</span></div>
<div class="form left">
<p>
<label for="from_city">出发城市</label>
<input type="text" name="from_city" placeholder="城市名">
</p>
<p>
<label>返回城市</label>
<input type="text" placeholder="城市名">
</p>
</div>
<div class="form center">
<p>
<label>出发时间</label>
<input type="text" placeholder="时间/日期">
</p>
<p>
<label>返回时间</label>
<input type="text" placeholder="时间/日期">
</p>
</div>
<div class="form right">
<p class="center">
<button type="button" class="submit">订票</button>
</p>
</div>
</form>
<div class="list_news">
<h2>最新机票</h2>
<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>
</ul>
<table>
<thead>
<tr>
<th>路线</th>
<th>日期</th>
<th>价格</th>
<th>税费</th>
<th>餐食</th>
<th>航班</th>
<th>预定</th>
</tr>
</thead>
<tbody>
<tr>
<td>北京-成都</td>
<td>10-15</td>
<td class="price">¥745</td>
<td>¥50</td>
<td>有</td>
<td>春秋航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-上海</td>
<td>10-15</td>
<td class="price">¥479</td>
<td>¥45</td>
<td>无</td>
<td>南方航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-深圳</td>
<td>10-15</td>
<td class="price">¥561</td>
<td>¥52</td>
<td>有</td>
<td>西部航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-杭州</td>
<td>10-15</td>
<td class="price">¥378</td>
<td>¥36</td>
<td>无</td>
<td>天津航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-广州</td>
<td>10-15</td>
<td class="price">¥612</td>
<td>¥44</td>
<td>有</td>
<td>首都航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-重庆</td>
<td>10-15</td>
<td class="price">¥428</td>
<td>¥62</td>
<td>有</td>
<td>东方航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-昆明</td>
<td>10-15</td>
<td class="price">¥509</td>
<td>¥35</td>
<td>无</td>
<td>厦门航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-厦门</td>
<td>10-15</td>
<td class="price">¥893</td>
<td>¥73</td>
<td>有</td>
<td>深圳航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
<tr>
<td>北京-长沙</td>
<td>10-15</td>
<td class="price">¥663</td>
<td>¥46</td>
<td>无</td>
<td>四川航空</td>
<td><a href="###" class="reserve">预定</a>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="7"><a href="###" class="ticket_more">加载更多航班...</a>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
<footer id="footer">
<div class="top">
<ul>
<li><a href="">客户端</a></li>
<li><a href="">触屏版</a></li>
<li><a href="">电脑版</a></li>
</ul>
</div>
<div class="bottom">Copyright © YCKU 瓢城旅行社| 苏ICP 备120110119 号</div>
</footer>
</body>
</html>
gitextract_by42yn_g/
├── .gitignore
├── README.md
├── about.html
├── css/
│ ├── basic.css
│ ├── column.css
│ └── style.css
├── index.html
├── informations.html
├── scenery.html
├── ticket.html
└── wap/
├── README.md
├── about.html
├── css/
│ └── style.css
├── index.html
├── informations.html
└── ticket.html
Condensed preview — 16 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (84K chars).
[
{
"path": ".gitignore",
"chars": 229,
"preview": ".DS_Store\nnode_modules\n/dist\n\n# local env files\n.env.local\n.env.*.local\n\n# Log files\nnpm-debug.log*\nyarn-debug.log*\nyarn"
},
{
"path": "README.md",
"chars": 551,
"preview": "# HTML5+CSS实现雪花旅行社\n\n## pc端\n\n 演示地址:https://mingyangya.github.io/tour-project/index.html\n \n- 首页效果\n\n no-repeat center"
},
{
"path": "index.html",
"chars": 4527,
"preview": "<!DOCTYPE html>\r\n<html lang=\"zh-cn\">\r\n<head>\r\n\t<meta charset=\"UTF-8\">\r\n\t<title>首页--旅游网站</title>\r\n\t<link rel=\"stylesheet\""
},
{
"path": "informations.html",
"chars": 11172,
"preview": "<!DOCTYPE html>\r\n<html lang=\"zh-cn\">\r\n<head>\r\n\t<meta charset=\"UTF-8\">\r\n\t<title>旅游资讯--旅游网站</title>\r\n\t<link rel=\"styleshee"
},
{
"path": "scenery.html",
"chars": 4121,
"preview": "<!DOCTYPE html>\r\n<html lang=\"zh-cn\">\r\n<head>\r\n\t<meta charset=\"UTF-8\">\r\n\t<title>风景欣赏--旅游网站</title>\r\n\t<link rel=\"styleshee"
},
{
"path": "ticket.html",
"chars": 6325,
"preview": "<!DOCTYPE html>\r\n<html lang=\"zh-cn\">\r\n<head>\r\n\t<meta charset=\"UTF-8\">\r\n\t<title>机票预订--旅游网站</title>\r\n\t<link rel=\"styleshee"
},
{
"path": "wap/README.md",
"chars": 24,
"preview": "# HTML5+CSS实现雪花旅行社(手机版)\n"
},
{
"path": "wap/about.html",
"chars": 1910,
"preview": "<!DOCTYPE html>\n<html lang=\"zh-cn\">\n\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-w"
},
{
"path": "wap/css/style.css",
"chars": 8058,
"preview": "@charset \"utf-8\";\nhtml {\n font-size: 625%;\n}\n\nbody,\nul,\nol,\nli,\nh2,\nh3,\nh4,\np,\nhr,\nfigure,\nhgroup {\n padding: 0;\n "
},
{
"path": "wap/index.html",
"chars": 3799,
"preview": "<!DOCTYPE html>\n<html lang=\"zh-cn\">\n<head>\n\t<meta charset=\"UTF-8\">\n\t<meta name=\"viewport\" content=\"width=device-width, i"
},
{
"path": "wap/informations.html",
"chars": 4234,
"preview": "<!DOCTYPE html>\n<html lang=\"zh-cn\">\n\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-w"
},
{
"path": "wap/ticket.html",
"chars": 6807,
"preview": "<!DOCTYPE html>\n<html lang=\"zh-cn\">\n\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-w"
}
]
About this extraction
This page contains the full source code of the mingyangya/tour-project GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 16 files (65.4 KB), approximately 23.7k tokens. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.