html期末作业代码⽹页设计——鲜花礼品在线购物⽹站(21
页)HTML+CSS+JavaS。。。
HTML5期末⼤作业:鲜花礼品⽹站设计——鲜花礼品在线购物⽹站(21页)
HTML+CSS+JavaScript web⽹页设计实例作业
常见⽹页设计作业题材有 个⼈、美⾷、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节⽇、戒烟、电影、摄影、⽂化、家乡、鲜花、礼品、汽车、其他 等⽹页设计题⽬, A+⽔平作业, 可满⾜⼤学⽣⽹页⼤作业⽹页设计需求, 喜欢的可以下载!
作品介绍
1.⽹页作品简介 :HTML期末⼤学⽣⽹页设计作业 A+⽔平 ,喜欢的可以下载,⽂章页⽀持⼿机PC响应式布局。
2.⽹页作品编辑:作品下载后可使⽤任意HTML编辑软件(如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改⽹页)。
3.⽹页作品技术:Div+CSS、⿏标滑过特效、Table、导航栏效果、banner、表单、⼆级三级页⾯等,视频、 ⾳频元素 、Flash,同时设计了logo(源⽂件),基本期末作业所需的知识点全覆盖。
⽂章⽬录
⼀、作品展⽰
⼆、⽂件⽬录
三、代码实现
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible"content="IE=edge"/>
<title>唯星集团</title>
<meta name="keywords"content="唯星集团">
<meta name="description"content="唯星集团">
<meta name="viewport"content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <link rel="shortcut icon"href="favicon.ico">
<!-- include main css -->
<link rel="stylesheet"type="text/css"href="css/slick_1.css"/>
<link rel="stylesheet"type="text/css"href="css/bootstrap_1.css"/>
<link rel="stylesheet"type="text/css"href="u.all_1.css"/>
<link rel="stylesheet"type="text/css"href="css/style_1.css"/>
<link rel="stylesheet"type="text/css"href="ustomscrollbar_1.css"/>
<link rel="stylesheet"href="css/animates.css"/>
<!--[if lt IE 9]>
<script src="js/html5.min_1.js"></script>
<script src="js/respond.min_1.js"></script>
<script type="text/javascript" src="js/selectivizr.js" ></script>
<![endif]-->
</head>
</head>
<body>
<div>
<!--header-->
<header class="header">
<section class="container">
<a href="#mmenu"class="glyphicon glyphicon-list phone-nav"></a>
</section>
<div class="container clearfix">
<div class="logo pull-left"><a href="index.html"><img src="picture/logo.png"alt=""/></a></div> <nav class="nav pull-left">
<ul>
<li class="active"><a href="index.html">⾸页</a></li>
<li><a href="about.html">关于XX</a>
<ul>
<li><a href="about.html">公司简介</a></li>
<li><a href="#">董事长致辞</a></li>
<li><a href="honor.html">荣誉资质</a></li>
<li><a href="#">企业⽂化</a></li>
<li><a href="#">发展历程</a></li>
</ul>
</li>
<li><a href="pro.html">产品展⽰</a>
<ul>
<li><a href="pro.html">纱线</a>
<div class="three">
<a href="pro.html">纱线⼀</a>
<a href="pro.html">纱线⼆</a>
<a href="pro.html">纱线三</a>
<a href="pro.html">纱线四</a>
</div>
</li>
<li><a href="pro.html">坯布</a>
<div class="three">
<a href="pro.html">坯布⼀</a>
<a href="pro.html">坯布⼆</a>
<a href="pro.html">坯布三</a>
<a href="pro.html">坯布四</a>
</div>
</li>
<li><a href="pro.html">⾯料</a>
<div class="three">
<a href="pro.html">⾯料⼀</a>
<a href="pro.html">⾯料⼆</a>
<a href="pro.html">⾯料三</a>
<a href="pro.html">⾯料四</a>
</div>
</li>
<li><a href="pro.html">服装</a>
<div class="three">
<a href="pro.html">服装⼀</a>
<a href="pro.html">服装⼆</a>
<a href="pro.html">服装三</a>
<a href="pro.html">服装四</a>
</div>
</li>
</ul>
</li>
<li><a href="news.html">新闻资讯</a>
<ul>
<li><a href="news.html">公司新闻</a></li>
<li><a href="#">⾏业新闻</a></li>
</ul>
</li>
<li><a href="case.html">⽣产实⼒</a>
<li><a href="case.html">⽣产实⼒</a>
<ul>
<li><a href="case.html">硬件设备</a></li>
<li><a href="#">软件设备</a></li>
</ul>
</li>
<li><a href="job.html">⼈才招聘</a></li>
<li><a href="contact.html"></a>
<ul>
<li><a href="contact.html">联系⽅式</a></li>
<li><a href="message.html">在线留⾔</a></li>
</ul>
</li>
</ul>
</nav>
<div class="language pull-right">
<a class="cn"href="#">中⽂</a>
<a class="en"href="#">EN</a>
</div>
</div>
</header>
<!--banner-->
<section class="banner">
<div><a href=""><img src="picture/banner_1.jpg"alt=""></a></div> <div><a href=""><img src="picture/banner_1.jpg"alt=""></a></div> <div><a href=""><img src="picture/banner_1.jpg"alt=""></a></div> </section>
<!--移动端  Mmenu-->
<nav id="mmenu">
<ul>
<li><a href="">EN</a></li>
<li><a href="index.html">⾸页</a></li>
<li><a href="about.html">关于XX</a>
<ul>
<li><a href="about.html">公司简介</a></li>
<li><a href="">董事长致辞</a></li>
<li><a href="honor.html">荣誉资质</a></li>
<li><a href="">企业⽂化</a></li>
<li><a href="">发展历程</a></li>
</ul>
</li>
<li><a href="pro.html">产品展⽰</a>
<ul>
<li><a href="pro.html">纱线</a>
<ul>
<li><a href="pro.html">纱线⼀</a></li>
<li><a href="pro.html">纱线⼆</a></li>
<li><a href="pro.html">纱线三</a></li>
<li><a href="pro.html">纱线四</a></li>
java零基础该怎么学</ul>
</li>
<li><a href="pro.html">坯布</a>
<ul>
<li><a href="pro.html">坯布⼀</a></li>
<li><a href="pro.html">坯布⼆</a></li>
<li><a href="pro.html">坯布三</a></li>
<li><a href="pro.html">坯布四</a></li>
</ul>
</li>
<li><a href="pro.html">⾯料</a>
<ul>
<ul>
<li><a href="pro.html">⾯料⼀</a></li>
<li><a href="pro.html">⾯料⼆</a></li>
<li><a href="pro.html">⾯料三</a></li>
<li><a href="pro.html">⾯料四</a></li>
</ul>
</li>
<li><a href="pro.html">服装</a>
<ul>
<li><a href="pro.html">服装⼀</a></li>
<li><a href="pro.html">服装⼆</a></li>
<li><a href="pro.html">服装三</a></li>
<li><a href="pro.html">服装四</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="news.html">新闻资讯</a>
<ul>
<li><a href="news.html">公司新闻</a></li>
<li><a href="">⾏业新闻</a></li>
</ul>
</li>
<li><a href="case.html">⽣产实⼒</a>
<ul>
<li><a href="case.html">硬件设备</a></li>
<li><a href="">软件设备</a></li>
</ul>
</li>
<li><a href="job.html">⼈才招聘</a></li>
<li><a href="contact.html"></a>
<ul>
<li><a href="contact.html">联系⽅式</a></li>
<li><a href="message.html">在线留⾔</a></li>
</ul>
</li>
</ul>
</nav>
</div>
<!--⾸页产品系列-->
<div class="sypro">
<div class="container">
<div class="sytit-wrap fadeInDown wow">
<div class="sytit">
<div class="sytitwrap">
<h3>产品系列</h3>
<b>TRUELAND PRODUCT SERIES</b>
</div>
</div>
<p>致⼒于发展⾼附加值产品,全⾯提供增值服务;为员⼯、客户和股东创造最⼤价值,真诚回馈和服务社会</p> </div>
<div class="syprocon">
<ul class="clearfix">
<li class="fadeIn wow"data-wow-delay="0.2s">
<a href="pro-show.h
<!--Include Js-->
<script src="js/jquery-1.8.3-jquery.min.js"type="text/javascript"charset="utf-8"></script>

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。