<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<!-- Custom Theme files -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<!-- //Custom Theme files -->
<!-- Responsive Styles and Valid Styles -->
<style type="text/css">
body{
width: 100%;
background-color: #333;
margin:0;
padding:0;
-webkit-font-smoothing: antialiased;
}
html{
width: 100%;
}
table{
font-size: 14px;
border: 0;
}
/* ----------- responsivity ----------- */
/* ----------- responsivity ----------- */
@media only screen and (max-width: 768px){
.container {
width: 650px;
}
.4_grids{
width: 216px !important;
}
.container-middle{width: 416px !important;}
}
@media only screen and (max-width: 622px){
/*------ top header ------ */
.header-bg{width: 422px !important; height: 10px !important;}
.main-header{line-height: 28px !important;}
.main-subheader{line-height: 28px !important;}
/*----- --features ---------*/
.feature{width: 416px !important;}
.feature-middle{width: 216px !important; text-align: center !important;}
.feature-img{width: 422px !important; height: auto !important;}
.container{width: 500px !important;}
.container-middle{width: 416px !important;}
.mainContent{width: 216px !important;}
.main-image{width: 216px !important; height: auto !important;}
.banner{width: 216px !important; height: auto !important;}
/*------ sections ---------*/
.section-item{width: 216px !important;}
.section-img{width: 216px !important; height: auto !important;}
/*------- prefooter ------*/
.prefooter-header{padding: 0 10px !important; line-height: 24px !important;}
.prefooter-subheader{padding: 0 10px !important; line-height: 24px !important;}
/*------- footer ------*/
.top-bottom-bg{width: 416px !important; height: auto !important;}
.feature1{
width:160px !important;
}
.img-responsive{
width:100%;
}
}
@media only screen and (max-width: 640px){
/*------ top header ------ */
.header-bg{width: 440px !important; height: 10px !important;}
.main-header{line-height: 28px !important;}
.main-subheader{line-height: 28px !important;}
/*----- --features ---------*/
.feature{width: 420px !important;}
.feature-middle{width: 400px !important; text-align: center !important;}
.feature-img{width: 440px !important; height: auto !important;}
.container{width: 440px !important;}
.container-middle{width: 420px !important;}
.mainContent{width: 400px !important;}
.main-image{width: 400px !important; height: auto !important;}
.banner{width: 400px !important; height: auto !important;}
/*------ sections ---------*/
.section-item{width: 400px !important;}
.section-img{width: 400px !important; height: auto !important;}
/*------- prefooter ------*/
.prefooter-header{padding: 0 10px !important; line-height: 24px !important;}
.prefooter-subheader{padding: 0 10px !important; line-height: 24px !important;}
/*------- footer ------*/
.top-bottom-bg{width: 420px !important; height: auto !important;}
}
@media only screen and (max-width: 480px){
.container {
width: 160px !important;
}
.icon {
width: 70%;
}
}
@media only screen and (max-width: 479px){
/*------ top header ------ */
.header-bg{width: 280px !important; height: 10px !important;}
.top-header-left{width: 260px !important; text-align: center !important;}
.top-header-right{width: 260px !important;}
.main-header{line-height: 28px !important; text-align: center !important;}
.main-subheader{line-height: 28px !important; text-align: center !important;}
/*------- header ----------*/
.logo{width: 260px !important;}
.nav{width: 260px !important;}
/*----- --features ---------*/
.feature{width: 260px !important;}
.feature-middle{width: 240px !important; text-align: center !important;}
.feature-img{width: 260px !important; height: auto !important;}
.container{width: 290px !important;}
.container-middle{width: 260px !important;}
.mainContent{width: 240px !important;}
.main-image{width: 240px !important; height: auto !important;}
.banner{width: 240px !important; height: auto !important;}
/*------ sections ---------*/
.section-item{width: 240px !important;}
.section-img{width: 240px !important; height: auto !important;}
/*------- prefooter ------*/
.prefooter-header{padding: 0 10px !important;line-height: 28px !important;}
.prefooter-subheader{padding: 0 10px !important; line-height: 28px !important;}
/*------- footer ------*/
.top-bottom-bg{width: 260px !important; height: auto !important;}
table {
width: 100% !important;
}
.gallery-img a img {
height: 134px !important;
}
.gallery-img1 a img {
height: 60px !important;
}
.gallery-img2 a img {
height: 60px !important;
}
tr.m-ttl {
text-align:left!important;
}
}
@media only screen and (max-width:384px){
span.h-tittle {
font-size: 1.8em!important;
}
a.logo-t {
font-size:2.5em!important;
}
td.price {
font-size:1.8em!important;
}
table.ban{
background: url(images/banner.jpg);
background-size:cover;
height: 230px!important;
}
td.mid-gap {
height: 0!important;
}
tr.m-ttl {
text-align:left!important;
}
td.sub-t{
font-size:1.9em!important;
}
}
@media only screen and (max-width:320px){
span.h-tittle {
font-size: 1.5em!important;
text-align: left!important;
}
a.logo-t {
font-size:2.5em!important;
}
td.price {
font-size:1.8em!important;
text-align:left!important;
}
table.ban{
background: url(images/banner.jpg);
background-size: cover;
height: 210px!important;
}
td.mid-gap {
height: 0!important;
}
td.sub-t{
font-size:1.9em!important;
}
}
</style>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr bgcolor="#333"><td height="30"></td></tr>
<tr bgcolor="#ffffff">
<!-- main content -->
<table width="800" border="0" cellpadding="0" cellspacing="0" align="center" class="container top-header-left" bgcolor="eeeeee">
<!-- banner -->
<!-- Start Menu List -->
<tr>
<td width="600" style="text-align:center;">
<table style="border-collaps:collaps; mso-table-lspace:0pt; mso-table-rspace:0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tr bgcolor="#8780ce">
紫色旅游窄屏HTML模板是一款简单实用的旅游类别模板素材下载。_html网站模板_网页源码移动端前端_H5模板_自适应.rar
50 浏览量
2023-08-05
15:04:24
上传
评论
收藏 1.82MB RAR 举报
紫色旅游窄屏HTML模板是一款简单实用的旅游类别模板素材下载。_html网站模板_网页源码移动端前端_H5模板_自适应.rar （32个子文件） 
紫色旅游窄屏HTML模板是一款简单实用的旅游类别模板素材下载。 moban1119 
index.html 50KB images 
s2.png 4KB
2.jpg 73KB db.png 3KB vimeo.png 3KB tw.png 3KB pin.png 3KB 10.png 143KB 13.jpg 55KB 14.jpg 45KB banner.jpg 234KB mail.png 3KB 15.jpg 44KB s3.png 7KB 1.jpg 58KB 12.jpg 37KB fb.png 3KB 11.png 144KB 6.png 3KB 8.jpg 47KB 5.png 3KB 8.png 4KB s1.png 5KB 88.jpg 526KB ab.jpg 195KB 7.png 4KB 3.jpg 75KB 7.jpg 44KB map.png 3KB mid.jpg 152KB mb.png 3KB 4.jpg 43KB资源评论
