网页设计作业 HTML5期末大作业：旅游网站设计——蓝色的地方旅游门户(9页) HTML+CSS+JavaScript

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

这是一份HTML5期末大作业，设计了一个9页的蓝色地方旅游门户，包含HTML、CSS和JavaScript实现。作品支持手机和PC响应式布局，涵盖了Div+CSS、鼠标效果、导航、表单等多种网页设计元素。提供作品展示、文件目录和代码实现的详细内容，还分享了学习资源和更多源码获取途径。

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

HTML5期末大作业：旅游网站设计——蓝色的地方旅游门户(9页) HTML+CSS+JavaScript

常见网页设计作业题材有 个人、美食、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节日、戒烟、电影、摄影、文化、家乡、鲜花、礼品、汽车、其他 等网页设计题目, A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!

作品介绍

1.网页作品简介 ：HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载，文章页支持手机PC响应式布局。

2.网页作品编辑：作品下载后可使用任意HTML编辑软件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改网页）。

3.网页作品技术：Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等，视频、音频元素、Flash，同时设计了logo（源文件），基本期末作业所需的知识点全覆盖。

文章目录

HTML5期末大作业：旅游网站设计——蓝色的地方旅游门户(9页) HTML+CSS+JavaScript
作品介绍
一、作品展示
二、文件目录
三、代码实现
四、获取更多源码
五、学习资料
六、更多源码

一、作品展示

在这里插入图片描述

二、文件目录

在这里插入图片描述

三、代码实现



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>首页 - 吃 - 兴文旅游网</title>
<link type="text/css" rel="stylesheet" href="css/style.css"/>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.scrollfollow.js"></script>
<script type="text/javascript" src="js/flash.js"></script>
<script type="text/javascript" src="js/int.js"></script>
</head>
<body>
<div id="topBar">
	<div class="wrapper">
		<div class="l">游客您好，欢迎访问兴文旅游资讯网！</div>
		<div class="r">
			<a href="#" onclick="window.external.AddFavorite(location.href,'兴文旅游网');">加入收藏</a>
			<a href="#" onclick="this.style.behavior='url(#default#homepage)';this.setHomePage(location.href);">设为首页</a>
			<span>
			<a href="http://shop.xingwentour.gov.cn/" target="_blank">旅游商城</a>|
			<a href="http://www.xwta.gov.cn" target="_blank">政务网</a>|
			<a href="http://en.xingwentour.gov.cn" target="_blank">English</a>
			</span>
		</div>
	</div>
</div>
<div id="header">
	<div class="wrapper">
		<div class="logo">
			<a href="/"><img src="images/logo.gif" alt="兴文旅游资讯网" /></a>
			<h1>兴文县旅游门户　兴文县旅游信息平台</h1>
		</div>
		<form target="_blank" action="/search.aspx" method="get"><div class="search">
			<dl>
				<dd><a id="search_type1" onclick="select_search_type(1);return false;" href="#" class="current">景点</a></dd>
				<dd><a id="search_type2" onclick="select_search_type(2);return false;" href="#">线路</a></dd>
				<dd><a id="search_type3" onclick="select_search_type(3);return false;" href="#">资讯</a></dd>				
			</dl>
			<ul>
				<li><a href="/live/hotel_list.aspx" target="_blank">酒店住宿</a></li>
				<li><a href="/eat/foodshops.aspx" target="_blank">餐饮娱乐</a></li>
			</ul>	
			<div>
				<input type="text" name="q" onfocus="if(this.value=='这是一个神奇的搜索'){this.value='';}" value="这是一个神奇的搜索" />
				<input name="search_type" id="search_type" value="1" type="hidden"  /><button type="submit">搜索</button>
			</div>
			<p><strong>热门搜索：</strong><a href="/search.aspx?search_type=1&q=%D0%CB%CE%C4%CA%AF%BA%A3">兴文石海</a><a href="/search.aspx?search_type=1&q=%83k%CD%F5%C9%BD%BE%B0%C7%F8">僰王山景区</a><a href="/search.aspx?search_type=3&q=+%CF%E3%CB%AE%C9%BD"> 香水山</a><a href="/search.aspx?search_type=3&q=qw">qw</a><a href="/search.aspx?search_type=1&q=adsf">adsf</a><a href="/search.aspx?search_type=1&q=%D1%CF%BC%D2%B6%B4">严家洞</a></p>
		</div></form>
	</div>
</div>
<div id="nav">
	<dl>
		<div><iframe src