网页设计与制作成品——黑色的山河旅行社网站(5个页面)HTML+CSS+JavaScript
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
<title>山河旅行社</title>
<link rel="stylesheet" href="css/">
</head>
<body>
<header id="header">
<div class="center">
<h1 class="logo">山河旅行社</h1>
<nav class="link" >
<h2 style="display:none;">网站导航</h2>
<ul>
<li class="active"><a href="###">首页</a></li>
<li><a href=""><span class="xs-hidden">旅游</span>资讯</a></li>
<li><a href="">机票<span class="xs-hidden">订购</span></a></li>
<li class="xs-hidden"><a href="">风景欣赏</a></li>
<li><a href=""><span class="xs-hidden">关于</span>公司</a></li>
</ul>
</nav>
</div>
</header>
<div id="adver">
<img src="picture/" alt="">
<div class="center"></div>
<div class="center copy">
<input type="text" class="search" placeholder="请输入旅游景点或城市">
<button class="button">搜索</button>
</div>
</div>
<div id="tour">
<section class="center ">
<h2>热门旅游</h2>
<p>国内旅游，国外旅游、自助旅游、自驾旅游、游轮签证、主题旅游等各种最新热门旅游推介</p>
</section>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
<figure>
<img src="picture/" alt="">
<figcaption>
<div class="tour_title">
<strong><曼谷-芭提雅6日游></strong> 包团特惠，超丰富景点，升级1晚国五，无自费，更赠送600元成人资费券
</div>
<div class="info">
<em class="sat">满意度97%</em>
<span class="price"> ￥<strong> 2864</strong> 起</span>
</div>
<div class="type">国内长线</div>
</figcaption>
</figure>
</div>
<footer id="footer">
<div class="top sm-hidden">
<div class="block left">
<h2>合作伙伴</h2>
<hr>
<ul class="ul">
<li>途牛旅游网</li>
<li>驴妈妈旅游网</li>
<li>携程旅游</li>
<li>中国青年旅社</li>
</ul>
</div>
<div class="block center">
<h2>旅游FAQ</h2>
<hr>
<ul class="ul">
<li>旅游合同签订方式？</li>
<li>儿童价是基于什么制定的？</li>
<li>旅游的线路品质是怎么界定的？</li>
<li>旅游保险有些什么种类？</li>
</ul>
</div>
<div class="block right">
<h2>联系方式</h2>
<hr>
<ul class="ul">
<li>微博：/maodo</li>
<li>邮件：sh@</li>
<li>地址：西安市雁塔区123号</li>
</ul>
</div>
</div>
<div class="chearfix"></div>
<div class="version sm-visible">
客户端 | 触屏版 | 电脑版
</div>
<div class="bottom">Copyright © SHMD 山河旅行社| 陕ICP 备120110119 号<span class="sm-hidden">| 旅行社经营许可证：L-SH-BK12345</span></div>
</footer>
</body>
</html>