-
HTML期末大学生网页设计作业——奇恩动漫HTML (1页面) HTML CSS JS网页设计期末课程大作业
HTML实例网页代码, 本实例适合于初学HTML的同学。该实例里面有设置了css的样式设置，有div的样式格局，这个实例比较全面，有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计。
@[TOC](文章目录🌰)网页介绍📖
1 网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平, 非常适合初学者学习使用。
2.网页编辑：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。
3.知识应用：技术方面主要应用了网页知识中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等，视频、 音频元素 、Flash，同时设计了Logo（源文件）所需的知识点。
网页效果🌌
# 代码展示😈
## 1.HTML代码结构 🧱 代码如下（示例）：以下仅展示部分代码供参考~<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>奇恩动漫title> <link rel="stylesheet" type="text/css" href="pic/style.css" /> <script type="text/javascript" src="pic/jquery.SuperSlide.2.1.1.js">script> head> <body> <div id="header"> <div class="header"> <div class="logo"> <h1><a href="#"><img src="pic/logo.png" width="367" height="120">a>h1> div> <div class="logor"> <img src="pic/logor.png" width="262" height="120"> div> div> div> <div id="menu"> <div class="menu"> <ul id="nav" class="nav clearfix"> <li class="nLi color1"> <h3><a href="#" target="_blank">首页a>h3> li> <li class="nLi color7"> <h3><a href="#" target="_blank">关于奇恩a>h3> <ul class="sub"> <li><a href="#">公司介绍a>li> <li><a href="#">三大业务a>li> <li><a href="#">最新资讯a>li> <li><a href="#">合作伙伴a>li> <li><a href="#">公司环境a>li> ul> li> <li class="nLi color2"> <h3><a href="#" target="_blank">师资团队a>h3> <ul class="sub"> <li><a href="#">个人简介a>li> <li><a href="#">老师作品a>li> <li><a href="#">教学经验a>li> ul> li> <li class="nLi color3"> <h3><a href="#" target="_blank">课程设置a>h3> <ul class="sub"> <li><a href="#">动漫课程a>li> <li><a href="#">动漫课程a>li> <li><a href="#">动漫课程a>li> <li><a href="#">动漫课程a>li> ul> li> <li class="nLi color4"> <h3><a href="#" target="_blank">就业资讯a>h3> <ul class="sub"> <li><a href="#">就业明显a>li> <li><a href="#">就业服务a>li> <li><a href="#">面试简历a>li> <li><a href="#">企业招聘a>li> ul> li> <li class="nLi color5"> <h3><a href="#" target="_blank">学员天地a>h3> <ul class="sub"> <li><a href="#">学生作品a>li> <li><a href="#">学习动态a>li> <li><a href="#">学生活动a>li> ul> li> <li class="nLi color6"> <h3><a href="#" target="_blank">在线报名a>h3> <ul class="sub"> <li><a href="#">快捷咨询a>li> <li><a href="#">在线留言a>li> ul> li> <li class="nLi color2"> <h3><a href="#" target="_blank">xx我们a>h3> <ul class="sub"> <li><a href="#">xx地址a>li> <li><a href="#">xx电话a>li> ul> li> ul> div> div> <div id="slideBox" class="slideBox"> <div class="bd"> <ul> <li style="background:url(pic/1.jpg) no-repeat 50% 0;"><a href="#" target="_blank">a>li> <li style="background:url(pic/2.jpg) no-repeat 50% 0;"><a href="#" target="_blank">a>li> ul> div> <a class="prev" href="javascript:void(0)">a> <a class="next" href="javascript:void(0)">a> div> <div class="clear">div> <div id="yewu"> <div class="ititle">奇恩动漫三大业务div> <div class="yewu"> <a class="yewu1" href="#"> <div class="yewuimg"><img src="pic/yewu.png" width="63" height="63">div> <div class="yewup"> <p class="yewup1">制作业务p> <p class="yewup2">致力于开发和制作高品质动画项目，拥有LAVA（臭屁虫）、PUCCA（xx娃娃）、FRANKY&FRIENDS、等，众多著名动画IP项目授权。p> div> a> <a class="yewu2" href="#"> <div class="yewuimg"><img src="pic/yewu.png" width="63" height="63">div> <div class="yewup"> <p class="yewup1">制作业务p> <p class="yewup2">致力于开发和制作高品质动画项目，拥有LAVA（臭屁虫）、PUCCA（xx娃娃）、FRANKY&FRIENDS、等，众多著名动画IP项目授权。p> div> a> <a class="yewu3" href="#"> <div class="yewuimg"><img src="pic/yewu.png" width="63" height="63">div> <div class="yewup"> <p class="yewup1">制作业务p> <p class="yewup2">致力于开发和制作高品质动画项目，拥有LAVA（臭屁虫）、PUCCA（xx娃娃）、FRANKY&FRIENDS、等，众多著名动画IP项目授权。p> div> a> div> div> <div class="clear">div> <div id="news"> <div class="news"> <div class="ititle2"><p>新闻资讯p>div> <div class="border-box"> <div class="border-box1"> <a href="#" target="_blank"> <div class="divimg"><img src="pic/news.jpg">div> <h3>“融汇深圳设计·服务xx创造”深圳市商业美术设计促进会h3> a> div> <div class="border-box2"> <a href="#" target="_blank"> <div class="divimg"><img src="pic/news.jpg">div> <h3>“融汇深圳设计·服务xx创造”深圳市商业美术设计促进会h3> a> div> div> <ul class="newsli"> <li><a href="#" target="_blank">中鹏服装设计培训中心精英老师系列人物访谈之“做最好的职业教育”a>li> <li><a href="#" target="_blank">热烈祝贺中鹏培训2015年11月采购师与物流师考试通过率再创新高！a>li> <li><a href="#" target="_blank">热烈欢迎评估专家组到深圳市宝安区中鹏职业培训中心进行评估工作a>li> <li><a href="#" target="_blank"> 热烈祝贺中鹏培训参评“全国职工教育培训先进集体”初审通过a>li> ul> div> <div class="jishu"> <div class="ititle2"><p>技术分享p>div> <div class="border-box"> <div class="border-box1"> <a href="#" target="_blank"> <div class="divimg"><img src="pic/news.jpg">div> <h3>“融汇深圳设计·服务xx创造”深圳市商业美术设计促进会h3> a> div> <div class="border-box2"> <a href="#" target="_blank"> <div class="divimg"><img src="pic/news.jpg">div> <h3>“融汇深圳设计·服务xx创造”深圳市商业美术设计促进会h3> a> div> div> <ul class="newsli"> <li><a href="#" target="_blank">中鹏服装设计培训中心精英老师系列人物访谈之“做最好的职业教育”a>li> <li><a href="#" target="_blank">热烈祝贺中鹏培训2015年11月采购师与物流师考试通过率再创新高！a>li> <li><a href="#" target="_blank">热烈欢迎评估专家组到深圳市宝安区中鹏职业培训中心进行评估工作a>li> <li><a href="#" target="_blank"> 热烈祝贺中鹏培训参评“全国职工教育培训先进集体”初审通过a>li> ul> div> div> <div id="kecheng"> <div class="ititle">精品课程div> <div class="kecheng"> <div class="kechengl"> <ul> <li><a href="#">影视动画全科班a>li> <li><a href="#">影视动画全科班a>li> <li><a href="#">影视动画全科班a>li> <li><a href="#">影视动画全科班a>li> <li><a href="#">影视动画全科班a>li> <li><a href="#">影视动画全科班a>li> ul> div> <div class="kechengr"> <div class="multipleColumn"> <div class="hd"> <a class="next">a> <a class="prev">a> div> <div class="bd"> <div class="ulWrap"> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/s1.jpg" />a>div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/s2.jpg" />a>div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/s3.jpg" />a>div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/s1.jpg" />a>div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/s2.jpg" />a>div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/s3.jpg" />a>div> li> ul> div> div> div> div> div> div> <div class="clear">div> <div id="shizi"> <div class="ititle">超强师资团队div> <div class="shizi"> <div class="multipleColumn2"> <div class="hd"> <a class="next">a> <a class="prev">a> div> <div class="bd"> <div class="ulWrap2"> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/shizi.jpg" />a>div> <div class="title"><a href="#" target="_blank">张依沱<br>maya影视动画讲师a>div> <div class="text">供职于环球数码、奥飞等国内知名动漫公司，参与制作过《大圣归来》、《maya the bee》《超级飞侠》《寂静岭》等大型动画项目div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/shizi.jpg" />a>div> <div class="title"><a href="#" target="_blank">张依沱<br>maya影视动画讲师a>div> <div class="text">供职于环球数码、奥飞等国内知名动漫公司，参与制作过《大圣归来》、《maya the bee》《超级飞侠》《寂静岭》等大型动画项目div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/shizi.jpg" />a>div> <div class="title"><a href="#" target="_blank">张依沱<br>maya影视动画讲师a>div> <div class="text">供职于环球数码、奥飞等国内知名动漫公司，参与制作过《大圣归来》、《maya the bee》《超级飞侠》《寂静岭》等大型动画项目div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/shizi.jpg" />a>div> <div class="title"><a href="#" target="_blank">张依沱<br>maya影视动画讲师a>div> <div class="text">供职于环球数码、奥飞等国内知名动漫公司，参与制作过《大圣归来》、《maya the bee》《超级飞侠》《寂静岭》等大型动画项目div> li> ul> <ul> <li> <div class="pic"><a href="#" target="_blank"><img src="pic/shizi.jpg" />a>