HTML期末大作业课程设计~动漫游戏官网10个页面(HTML+CSS+JavaScript)

最新推荐文章于 2024-06-24 13:56:25 发布

@码出未来-web网页设计

最新推荐文章于 2024-06-24 13:56:25 发布

阅读量1.1w

点赞数 14

分类专栏：学生网页设置作业源码HTML Html+Css+JavaScript HTML期末大作业文章标签： HTML期末大作业课程设计动漫游戏官网HTML 个人设计web前端大作业 HTML网页设计结课作业 web学生网页设计作业源码

本文链接：https://blog.csdn.net/ruan365392777/article/details/118379512

版权

HTML期末大作业课程设计动漫主题html5网页~动漫官网html模板(HTML+CSS) ~个人设计web前端大作业

临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~

原始HTML+CSS页面设计, web大学生网页设计作业源码，~这是一个不错的网页制作，画面精明，非常适合初学者学习使用。

作品介绍

关于HTML网页设计期末课程大作业实现，大作业A+水平 ~，包含首页作品展示招贤纳士联系我们关于公司 5个大页面

此作品为学生个人主页网页设计题材，代码为简单学生水平 html+css 布局制作，作品下载后可使用任意HTML编辑软件（例如：DW、HBuilder、NotePAD, Vscode 所有编辑器均可使用）

网页作品布局方面：网页布局整体为LOGO、导航、轮播图、主体内容布局。子页面多种布局，兴趣爱好内容使用图片列表布局，成绩页面插入了表格，联系我们使用图片对齐方式设置了左对齐。

网页作品技术方面：使用CSS制作了网页背景图、鼠标经过及选中导航变色效果、下划线等。首页制作了留言表单，同时简单使用JavaScript制作了表单判断（提交时表单不能为空）
空）

文章目录

HTML期末大作业课程设计动漫主题html5网页~动漫官网html模板(HTML+CSS) ~个人设计web前端大作业
作品介绍
一、作品演示
二、代码目录
三、代码实现
四、前端 `零基础入门到高级 `(视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
六、更多HTML期末大作业文章
七、更多表白源码

一、作品演示

1.首页

在这里插入图片描述

2.作品展示

在这里插入图片描述

3.招贤纳士

在这里插入图片描述

4.联系我们

在这里插入图片描述

5.关于公司

在这里插入图片描述

二、代码目录

在这里插入图片描述

三、代码实现

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
   		<meta http-equiv="X-UA-Compatible" content="IE=edge">
   		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>动漫官网-首页</title>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="css/animate.min.css">
	</head>
	<body>
			<!--顶部-->
			<nav class="navbar navbar-default navbar-fixed-top">
				  <div class="container-fluid wrap">
				    <!-- Brand and toggle get grouped for better mobile display -->
				    <div class="navbar-header">
				      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
				        <span class="sr-only">Toggle navigation</span>
				        <span class="icon-bar"></span>
				        <span class="icon-bar"></span>
				        <span class="icon-bar"></span>
				      </button>
				      <!--logo-->
				      <a class="navbar-brand" href="#">
				      	<img src="img/logo.png" alt=""/>
				      </a>
				    </div>
				    <!-- Collect the nav links, forms, and other content for toggling -->
				    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
				      <!--<ul class="language navbar-right">
				        <li><a href="#" class="active">中</a></li>
				        <li>|</li>
				        <li><a href="#">EN</a></li>
				      </ul>-->
				      <ul class="nav navbar-nav main-nav  navbar-right">
				        <li class="active"><a href="index.html">首页</a></li>
				        <li><a href="worksShow.html">作品展示</a></li>
				        <li><a href="recruit.html">招贤纳士</a></li>
				        <li><a href="contract.html">联系我们</a></li>
				        <li><a href="about.html">关于公司</a></li>
				        <li class="lang"><a class="active">中</a>|<a href="en_index.html">EN</a></li>
				      </ul>
				    </div><!-- /.navbar-collapse -->
				  </div><!-- /.container-fluid -->
				</nav>
			<!-- Swiper -->
		  	<div class="swiper-container">
			    <div class="swiper-wrapper">
			      <div class=