时间：2023-10-15 08:30:01 | 来源：网站运营
时间：2023-10-15 08:30:01 来源：网站运营
中秋节静态HTML网页作业作品 大学生中秋网页设计制作成品 简单DIV CSS布局网站：精彩专栏推荐 文末获取联系 ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 作者主页: 【主页—— 获取更多优质源码】 web前端期末大作业： 【 毕设项目精品实战案例 (1000套) 】 程序员有趣的告白方式：【 HTML七夕情人节表白网页制作 (110套) 】 超炫酷的Echarts大屏可视化源码：【 echarts大屏展示大数据平台可视化(150套) 】 免费且实用的WEB前端学习指南： 【 web前端零基础到高级学习视频教程 120G干货分享】 关于作者: 历任研发工程师，技术组长，教学总监；曾于2016年、2020年两度荣获CSDN年度十大博客之星。 十载寒冰，难凉热血；多年过去，历经变迁，物是人非。 然而，对于技术的探索和追求从未停歇。 坚持原创，热衷分享，初心未改，继往开来！
在线咨询
节日介绍、节日发展、习俗庆祝、地区特色等内容，作品共多个页面，学生HTML静态网页基础水平制作，页面排版干净简洁。网页技术方面应用包括网页背景颜色、字号字体设置、超链接、图文页面、菜单栏、顶部大图等网页基础知识点Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。 其中： （1） html文件包含：其中index.html是首页、其他html为二级页面； （2） css文件包含：css全部页面样式,文字滚动, 图片放大等； （3） js文件包含：js实现动态轮播特效, 表单提交, 点击事件等等（个别网页中运用到js代码）。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> <title>中秋活动</title> <link rel="stylesheet" href="css/main.css"></head><body> <div class="_ui_active_wrap"> <div class="container"> <div class="_ui_active"> <span class="_ui_title_l"></span> <span class="_ui_title_r"></span> <span class="_ui_title_m"></span> <span class="_ui_title_b"></span> <div class="_ui_active_time"> 领取时间： 2017年8月23日至9月25日 </div> <div class="_ui_received"> 已领取 <span class="_ui_received_num">1986</span> 份 </div> <!--领取方式--> <div class="_ui_step clearfix"> <div class="_ui_step_l"> <img src="picture/step1.png" alt=""> </div> <div class="_ui_step_r"> <p> 符合领取资格的玩家，当您登录之后即有信息提示您进行领取，点击“立即领取”即可到会员中心填写您的收货地址，提交完毕后，工作人员会在10个工作日内发货，同时玩家也可以在会员中心页面查看您的物流订单号，再通过物流公司查询物流的状态。 </p> <p class="_ui_tips"> * 为确保您能顺利领取月饼礼盒，请您保持电话畅通 </p> </div> </div> <!--活动规则--> <div class="_ui_step clearfix"> <div class="_ui_step_r"> <p> 1. 凡符合领取资格的玩家，均可获得中秋精美礼盒一份。 </p> <p>2. 每位会员只限领取一份，礼品数量有限， 先到先得。</p> <p>3. 如活动期间，会员提供的地址或电话号码无效，导致礼品无法正常送达，将被视为自动放弃礼品。</p> <p> 4. 如礼品已经发货，玩家可通过快递单号咨询物流公司礼品快递进程 。 </p> <p class="_ui_tips_yellow"> * 为了避免文字理解的差异，和记娱乐保留活动方案的解释权。 </p> </div> <div class="_ui_step_l"> <img src="picture/step2.png" alt=""> </div> </div> <!--填写发货信息--> <div class="_ui_step clearfix"> <div class="_ui_step_pic"> <img src="picture/step3.png" alt=""> </div> <div class="_ui_step_form"> <form action="#" onsubmit="return false;"> <h2 class="_ui_form_title">填写发货信息</h2> <dl class="_ui_step_dl clearfix"> <dt class="_ui_step_dt">联系人</dt> <dd class="_ui_step_dd"><input type="text" class="_ui_input"></dd> </dl> <dl class="_ui_step_dl clearfix"> <dt class="_ui_step_dt">联系电话</dt> <dd class="_ui_step_dd"><input type="text" class="_ui_input"></dd> </dl> <dl class="_ui_step_dl clearfix"> <dt class="_ui_step_dt">用户名</dt> <dd class="_ui_step_dd"><input type="text" class="_ui_input"></dd> </dl> <dl class="_ui_step_dl clearfix"> <dt class="_ui_step_dt">邮寄地址</dt> <dd class="_ui_step_dd"><input type="text" class="_ui_input"></dd> </dl> <dl class="_ui_step_dl clearfix"> <dt class="_ui_step_dt">快递方式</dt> <dd class="_ui_step_dd"><input type="text" class="_ui_input" value="默认选择顺丰"></dd> </dl> <div class="_ui_sub_box"> <input type="submit" value="提交" class="_ui_btn"> </div> </form> </div> </div> <!--物流查询--> <div class="_ui_step"> <div class="_ui_logistics"> <span class="_ui_logistics_icon"></span> <dl class="_ui_logistics_in clearfix"> <dt class="left _ui_logistics_dt"> 物流单号查询</dt> <dd class="left _ui_logistics_dd"> <input type="text" class="_ui_input" placeholder="请输入您的用户名"> <button class="check_order">查询</button> </dd> </dl> </div> </div> <!--留言区--> <div class="_ui_step"> <div class="_ui_message clearfix"> <div class="_ui_step_r clearfix"> <div class="_ui_message_dec"> <h2>留言区</h2> <p> 感谢您对帝王国际的支持及信赖，您有任何意见的话，可在留言区留言。 </p> </div> <div class="_ui_message_text"> <p>· 时代峰峻拉克丝的减肥了手机端开了房老家了沙</p> <p>· 祝愿网站越办越好</p> <p>· 滚动客户留言从下到上</p> <p>· 时代峰峻拉克丝的减肥了手机端开了房老家了沙</p> <p>· 祝愿网站越办越好</p> <p>· 滚动客户留言从下到上</p> </div> </div> <div class="_ui_step_l"> <img src="picture/step4.png" alt=""> </div> </div> <div class="_ui_message_con"> <form action="#" onsubmit="return false;"> <dl class="_ui_message_dl clearfix"> <dt class="_ui_message_dt">客户留言：</dt> <dd class="_ui_message_dd"> <textarea name="" id="" cols="30" rows="10"></textarea> </dd> </dl> <dl class="_ui_message_dl clearfix"> <dt class="_ui_message_dt">用户名：</dt> <dd class="_ui_message_dd"> <input type="text" class="_ui_input"> <button class="sub_message_btn">提交</button> </dd> </dl> </form> </div> </div> </div> </div> </div></body></html>@charset "utf-8";html { font-size: 625%;}body { font-family: "Microsoft Yahei UI", "Microsoft YaHei", SimHei, "宋体", simsun, sans-serif; font-size: 16px; background: #fff; color: #333333; min-width:320px; overflow-x: hidden;}body, h2, ul, p, dl, h4, h5, h3, dl, dt, dd { padding: 0; margin: 0; font-weight: normal;}* { box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -moz-tap-highlight-color: rgba(0, 0, 0, 0); -ms-tap-highlight-color: rgba(0, 0, 0, 0); -o-tap-highlight-color: rgba(0, 0, 0, 0); tap-highlight-color: rgba(0, 0, 0, 0);}ul { list-style: none;}a, a:link, a:hover, a:visited, a:active { text-decoration: none; border: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: transparent; outline: none;}i, em { font-style: normal;}img { border: none; vertical-align: middle;}input, button, select, textarea { background: transparent; outline: none; border: none; color: #787878;}请 “ 点赞” “✍️评论” “ 收藏”一键三连哦！ 【 关注我| 获取更多源码 | 优质文章】带您学习各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者，一起探讨 前端 Node 知识，互相学习」！关键词：中秋,布局,简单,作成,大学生,静态,作业,设计
