学生DW静态网页设计旅游—我的家乡新密(15页)含论文新密旅游网页设计制作简单静态HTML网页作品我的家乡网页作业成品学生旅游网站模板

最新推荐文章于 2023-12-20 11:19:57 发布

优质内容贡献

最新推荐文章于 2023-12-20 11:19:57 发布

阅读量1k

点赞数

分类专栏：学生div+css静态网页设计成品 web大学生个人网站作业模 html网页设计作业文章标签： html css 前端 javascript html5

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

版权

这是一个HTML5期末大作业，展示了作者设计的15页新密旅游静态网页，包括详细的设计和代码实现，旨在呈现新密的家乡风光。作品包含了论文和简单的HTML网页制作，适合学生学习和参考。

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

HTML5期末大作业：我的家乡网站设计——旅游—我的家乡新密(15页)含论文新密旅游网页设计制作简单静态HTML

文章目录

HTML5期末大作业：我的家乡网站设计——旅游—我的家乡新密(15页)含论文新密旅游网页设计制作简单静态HTML
一、作品展示
二、文件目录
三、代码实现
四、获取更多源码

一、作品展示

在这里插入图片描述

二、文件目录

在这里插入图片描述

三、代码实现


<!DOCTYPE html>
<html>
<head>
<title>我的家乡新密</title>
<!-- for-mobile-apps -->
<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="Your Trip Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() {
      setTimeout(hideURLbar, 0); }, false);
		function hideURLbar(){
      window.scrollTo(0,1); } </script>
<!-- //for-mobile-apps -->
<link rel="stylesheet" href="css/Infini.css">
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<!-- js -->
<script src="js/jquery-1.11.1.min.js"></script>
<!-- //js -->
<link href='https://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,700,800,900' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'>
<!-- start-smoth-scrolling -->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>

<script type="text/javascript">
	jQuery(document).ready(function($) {
     
		$(".scroll").click(function(event){
     		
			event.preventDefault();
			$('html,body').animate({
     scrollTop:$(this.hash).offset().top},1000);
		});
	});
</script>
<!-- start-smoth-scrolling -->
</head>
	
<body>
	<header>
		<img src="images/LOGO1.png" alt="">
		<!-- 导航部分 -->
		<nav>
			<ul>
				<li><a href="index.html" class="active">首页</a></li>
				<li><a href="about.html">关于新密</a></li>
				<li><a href="classify.html">分类</a></li>
				<li><a href="intro.html">景点简介</a></li>
				<li><a href="#contact" class="scroll">联系我们</a></li>			
			</ul>
		</nav>
	</header>
    <ul id="ul1">
				<li></li>
				<li></li>
				<li></li>
				<li></li>
			</ul>
<!-- //banner -->
<!-- portfolio -->
 <div id="fen"></div>
	<div class="portfolio">
		<div class="container">
			<h3>分类</h3>
			<div class="portfolio-grids">
				<div class="sap_tabs">			
				<div id="horizontalTab" style="display: block; width: 100%; margin: 0px;">
					<ul class="resp-tabs-list">
						<li class="resp-tab-item"><span><a href="classify.html">全部</a></span></li>
						<li class="resp-tab-item"><span><a href="c1.html">标志建筑</a></span></li>
						<li class="resp-tab-item"><span><a href="c2.html">最受欢迎</a></span></li>