html期末作业代码网页设计：主题出行网站设计——贵州山地旅游 (1页) web期末作业设计网页_

本文链接：https://blog.csdn.net/qq_524614081/article/details/122353727

这是一个关于html期末作业的网页设计项目，展示了一个主题为贵州山地旅游的网站设计，包括作品呈现、文件目录结构、代码实现细节，并提供了获取更多源码的途径。

摘要由CSDN通过智能技术生成

文章目录

一、作品展示
二、文件目录
三、代码实现
四、获取更多源码

一、作品展示

在这里插入图片描述

二、文件目录

在这里插入图片描述

三、代码实现


<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="css/swiper.min.css">
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <link rel="stylesheet" href="css/cloudzoom.css" />	
    <script src="js/jquery-1.11.3.min.js"></script>
    <script src="js/echarts.js"></script>
    <script src="js/guizhou.js"></script>
    <script src="js/swiper.min.js"></script>
    <script src="js/jquery.SuperSlide.2.1.1.js"></script>
    <script src="js/cloudzoom.js"></script>
    <script src="js/page.js"></script>
	<title>贵州山地旅游</title>
	<style type="text/css">
		body{
      min-width: 1200px !important;}
		.swiper-wrapper div.swiper-slide{
      float: left; width:11% !important;}
		.guizhoubg li{
      display: none;}
		.guizhous{
     opacity: 0;}
	</style>
	<!--启动CloudZoom就可以了，quickStart()立即启动-->
	<script type="text/javascript">
		CloudZoom.quickStart();
	</script>
</head>

<body>
	<!-- 头部 开始 -->
	<div class="head">
		<div class="head_top">
			<div class="w1200 clearFloat">
				<div class="left fl"><span>本商城推介信息为广告</span></div>
				<div class="right fr">
					<span>请</span>
					<a href="javascript:;">登录</a>|
					<a href="javascript:;">注册</a>|
					<a href="javascript:;">我的融e购</a>|
					<a href="javascript:;">购物车</a>|
					<a href="javascript:;">帮助中心</a>|
					<a href="javascript:;">客服电话</a>
				</div>
			</div>
		</div>
		<div class="head_down">
			<div class="w1200">
				<div class="logo fl">
					<a href="javascript:;">
						<img class="ig1" src="images/index1.png" />
						<img class="ig2" src="images/index2.png" />
					</a>
				</div>
				<div class="ser fr">
					<div class="right1">
						<div class="right1_box"><input type="text" placeholder="输入查找关键字" /></div>
						<input class="in2" type="button" value="搜索" />
					</div>
					<div class="right2"><span>热门搜索：科沃斯机器人</span></div>
				</div>
			</div>
		</div>
	</div>
	<!-- 头部 结束 -->
	<!-- 导航 开始 -->
	<div class="nav">
		<div class="w1200 clearFloat">
			<div class="left fl"><a href="javascript:;">所有商品分类</a></div>
			<div class="right fr">
				<ul class="clearFloat">
					<li><a href="javascript:;">首页</a></li>
					<li><a href="javascript:;