web期末作业网页设计——JavaScript
2024-04-22 18:27:59
目录
一.作品简介
二.网页效果
首页
花语
登录界面
注册界面
三.网页代码
首页
登录界面
注册界面
视频界面
一.作品简介
网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件。
网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。
二.网页效果
首页
花语
登录界面
注册界面
视频界面
三.网页代码
首页
<head><meta charset="utf-8" /><title>花遇（首页）</title><link rel="stylesheet" type="text/css" href="css/reset.css" /><link rel="stylesheet" type="text/css" href="css/index.css"/></head><div class="site-list"><ul class="clearfix"><li><a href="index1.html"><font color="coral"><b>首页</b></font></a></li><li><a href="dianying2.html">鲜花</a></li><li><a href="dianshij2.html">永生花</a></li><li><a href="#">在线订购</a></li><!-- tab下拉菜单 --><li class="qita"><a href="#">其他</a><ul class="dis"><li><a href="dianying2.html">礼品</a></li><li><a href="#">公仔</a></li><li><a href="#">绿植</a></li><li><a href="#">团购</a></li><li><a href="#">甄选</a></li></ul></li></ul></div>轮播图
<div class="site-content"><div class="container"><div class="box"><ul id="imglist"><li><img src="img/index/hua1.png" alt=""></li><li><img src="img/index/hua2.png" alt=""></li><li><img src="img/index/hua3.png" alt=""></li><li><img src="img/index/hua4.png" alt=""></li><li><img src="img/index/hua5.png" alt=""></li></ul><ul id="btnlist"><li class="btn active"></li><li class="btn"></li><li class="btn"></li><li class="btn"></li><li class="btn"></li></ul></div><script src="js/lunb.js"></script></div></div>tab菜单
<div id="tab"><div id="tabNav"><p><strong>鲜花用途</strong></p><ul><li class="active">爱情</li><li>慰问</li><li>商务</li></ul></div><div id="main"><div class="item show"><!-- tab爱情模块 --><div class="main-zuixin"><div class="zuixin-left"><!-- 左图 --><img src="img/index/shengrihua.png" /></div><div class="zuixin-right"><!-- 右图 --><div class="zuixin-right1"><!-- 左列 --><div><img src="img/index/aiqing1.png" /></div><div><img src="img/index/aiqing2.png" /></div></div><div class="zuixin-right2"><!-- 右列 --><div><img src="img/index/aiqing3.png" /></div><div><img src="img/index/aiqing4.png" /></div></div></div></div></div>右侧菜单栏
<div class="tableft"><div class="tableft-list"><h3>鲜花花材</h3></div><hr size="1" color="#A2A2A2"/><div class="tableft-list"><p><font face="微软雅黑" size="4"><i>1 </i></font></p><a href="#">玫瑰</a></div><div class="tableft-list"><p><font face="微软雅黑" size="4"><i>2 </i></font></p><a href="#">康乃馨</a></div><div class="tableft-list"><p><font face="微软雅黑" size="4"><i>3 </i></font></p><a href="#">郁金香</a></div><div class="tableft-list"><p><font face="微软雅黑" size="4"><i>4 </i></font></p><a href="#">马蹄莲</a></div><div class="tableft-list"><p><font face="微软雅黑" size="4"><i>5 </i></font></p><a href="#">向日葵</a></div> </div>底部栏
<div class="footer"><div class="container"><div class="footer-liebiao"><div class="guanyu"><table><tr class="neir"><td colspan="5"><h4>关于我们</h4></td></tr><tr><td><a href="#">关于我们</a></td><td><a href="#">联系我们</a></td><td><a href="#">在线反馈</a></td><td><a href="#">侵权投诉</a></td></tr></table></div><div class="xieyi"><table><tr class="neir"><td><h4>协议声明</h4></td></tr><tr><td><a href="#">用户协议</a></td><td><a href="#">隐私政策</a></td><td><a href="#">历史版本</a></td><td><a href="#">知识产权声明</a></td></tr></table></div></div>
登录界面
<div class="box"><div class="left"></div><div class="right"><h4>登 录</h4><form action="#"><input class="acc" type="text" id="username" placeholder="用户名"/><input class="acc" type="password" id="pwd" placeholder="密码"/></form><from action="#"><input class="submit" type="submit" id="log" value="登录"/></from><div class="down"><a href="zhuce.html">注册账号</a><a href="#">忘记密码？</a></div></div></div>注册界面
<div class="box"><div class="left"></div><div class="right"><h4>用户注册</h4><form action=""><input class="acc" type="text" id="username" placeholder="用户名"/><input class="acc" type="tel" id="phone" placeholder="手机号"/><input class="acc" type="password" id="pwd" placeholder="密码"/><input class="acc" type="password" id="pwd2" placeholder="确认密码"/></form><form action=""><input class="submit" type="submit" id="log" value="注册"/></form></div></div>视频界面
<head><meta charset="utf-8"><title>鲜花和浪漫</title><link rel="stylesheet" type="text/css" href="css/reset.css" /><link rel="stylesheet" type="text/css" href="css/Video.css" /></head><body><div class="beijing"><div class="header"><div class="container"><!-- logo --><div class="site-logo"><a href="#"></a></div><!-- 首页导航 --><div class="site-list"><ul class="clearfix"><li><a href="index1.html">首页</a></li><li><a href="dianying2.html"><font color="coral"><b>不止玫瑰有爱意</b></font></a></li></ul></div> <!-- 登入/注册 --><div class="login"><a href="dengru.html?"><img src="img/index/yonghu3.png"/></a></div><!-- 搜索框 --><div class="site-search"><form action=""><input class="search-text" type="text" placeholder="请输入关键字"/><input class="submit" type="submit" value="搜索"/></form></div></div></div><div id="ship"><div class="container"><video width="1000px" controls="controls" poster="img/huahai.jpg""><source src="img/shiping.mp4" type="video/mp4"></source></video></div></div></div>web期末作业网页设计——JavaScript相关推荐
- web期末作业网页设计——我的家乡（网页源码）
作品介绍 1.网页作品简介方面:HTML网站模板.主要有:首页 家乡简介 风景名胜 特色美食 站长介绍 在线调查 等总共 6 个页面html下载. 2.网页作品编辑:此作品为学生个人主页网页设计题材, ...
- web期末期中网页设计与制作项目展示
web网页设计与制作期末作品期末考试项目 适合大学期末期中考试及初学web网页设计者 本人大学web网页设计与制作课程总成绩94.5.本项目制作占期末65%,预估获得满分,最差情况最多扣了三五分. 最 ...
- HTML5期末大作业：网页设计——小米商城官网首页(1页) HTML+CSS+JavaScript web期末作业设计网页_清新淡雅个人网页大学生网页设计作业成品
HTML5期末大作业:网页设计--小米商城官网首页(1页) HTML+CSS+JavaScript web期末作业设计网页_清新淡雅个人网页大学生网页设计作业成品 常见网页设计作业题材有 个人. 美食 ...
- html网页设计作业代码——网上鲜花网页设计(5页)HTML+CSS+JavaScript web期末作业设计网页
HTML5期末大作业:网上鲜花网站设计--网上鲜花网页设计(5页)HTML+CSS+JavaScript web期末作业设计网页 常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电商. ...
- HTML5期末大作业：宠物之家网站设计——代码质量好宠之家(5页) HTML+CSS+JavaScript web期末作业设计网页
HTML5期末大作业:宠物之家网站设计--代码质量好宠之家(5页) HTML+CSS+JavaScript web期末作业设计网页 常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电商 ...
- web期末作业设计网页：动漫网站设计——蜡笔小新(10页) HTML+CSS+JavaScript 学生DW网页设计作业成品 动漫网页设计作业 web网页设计与开发 html实训大作业...
常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电商. 宠物. 电器. 茶叶. 家居. 酒店. 舞蹈. 动漫. 明星. 服装. 体育. 化妆品. 物流. 环保. 书籍. 婚纱. 游 ...
- web期末作业设计网页：个人生活网站设计——嘉尔明星(7页)带特效带音乐 HTML+CSS+JavaScript
HTML5期末大作业:个人生活网站设计--嘉尔明星(7页)带特效带音乐 HTML+CSS+JavaScript 期末作业HTML代码 学生网页课程设计期末作业下载 web网页设计制作成品 大学生毕设网 ...
- HTML5期末大作业：甜品店网站设计——美食甜品店铺加盟企业(1页) HTML+CSS+JavaScript web期末作业设计网页_美食网页设计作业成品
HTML5期末大作业:甜品店网站设计--美食甜品店铺加盟企业(1页) HTML+CSS+JavaScript web期末作业设计网页_美食网页设计作业成品 常见网页设计作业题材有 个人. 美食. 公司 ...
- html css javascript 动漫网页设计成品 (妖狐小红娘) 学生漫画网页DW制作 web实训网页设计 HTML5期末大作业...
常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电商. 宠物. 电器. 茶叶. 家居. 酒店. 舞蹈. 动漫. 明星. 服装. 体育. 化妆品. 物流. 环保. 书籍. 婚纱. 军 ...
最新文章
- arduino跑python,尝试在我的Arduino和stu上执行Python3.7.2中的代码
- .NET程序员，我们应该更专业点
- 模型验证的常用“武器”—ROC和AUC peiyang
- java 相加的函数_Java8 Collectors求和功能的自定义扩展操作
- python中字符串相关
- 华为人工智能计算机平台,华为发布首个人工智能移动计算平台
- Hopsan -- 液压、电力等行业的仿真开源软件
- 花了一个深夜，才用C语言写了一个2048游戏雏形
- noip2014到2017初赛普及组看程序写结果、完善程序
- 喀什师范学计算机学院学位论文开题报告,喀什师范学院本科生毕业论文开题报告.doc...
- java编写一个汽车类,有属性：品牌、型号、排量、速度，有方法：启动、加速、转弯、刹车、息火...
- 使用BCDboot工具，修复windows 系统启动，双启动菜单丢失故障
- 如何下载高清卫星地图
- python小明爬楼梯_Python3爬楼梯算法示例
- python制作流动图_炫酷！用Python制作漂亮的流动桑基图
- EXCEL：SUMIFS多条件求和2（筛选效果），含字符串转数组用法
- Ardublockly学习— —安装篇（一）
- 山东大学计算机组成与设计实验六 二进制补码加法器实验
- python抓取微博数据中心_空气质量数据网页爬虫加数据处理
- 算法#03--详解最小二乘法原理和代码