1
湖南财经工业职业技术学院
学生专业技能考核题库
适用专业：移动互联应用技术
2020 年 8 月
2
目 录
一、网页设计模块....................................................................................................................1
1. 试题编号：J1-1 旅行社网站设计-布局设计 ................................................1
2. 试题编号：J1-2 旅游社网站设计-登录页面 ................................................3
3. 试题编号：J1-3 旅游社网站设计-注册页面 ................................................5
4. 试题编号：J1-4 旅行社网站设计-产品介绍 ................................................7
5. 试题编号：J1-5 旅行社网站设计-布局设计 ..............................................10
6. 试题编号：J1-6 旅行社网站设计-表单设计 ..............................................12
7. 试题编号：J1-7 旅游社网站设计-新品推荐栏目 ......................................15
8. 试题编号：J1-8 旅行社网站设计-新闻栏目 ..............................................17
9. 试题编号：J1-9 旅行社网站设计-导航条 ..................................................19
10. 试题编号：J1-10 购物网站设计-布局设计 ................................................21
11. 试题编号：J1-11 购物网站设计-登录页面 ................................................23
12. 试题编号：J1-12 购物网站设计-登录页面 ................................................26
13. 试题编号：J1-13 购物网站设计-注册页面 ................................................28
14. 试题编号：J1-14 资讯网站设计-游记栏目 ................................................30
15. 试题编号：J1-15 资讯网站设计-热门景点栏目 ........................................33
16. 试题编号：J1-16 资讯网站设计-旅游景点栏目 .......................................35
17. 试题编号：J1-17 资讯网站设计-景点目的地栏目 ....................................37
18. 试题编号：J1-18 资讯网站设计-主题旅游栏目 ........................................39
19. 试题编号：J1-19 资讯网站设计-出境旅行栏目 ........................................42
20. 试题编号：J1-20 资讯网站设计-旅游资讯栏目 ........................................44
21. 试题编号：J1-21 资讯网站设计-资讯栏目 ................................................46
22. 试题编号：J1-22 资讯网站设计-旅游攻略 ................................................48
23. 试题编号：J1-23 资讯网站设计-出境旅游栏目 ........................................50
24. 试题编号：J1-24 资讯网站设计-旅行社排行榜栏目 ................................52
25. 试题编号：J1-25 资讯网站设计-旅行社资讯栏目 ....................................54
二、Web 前端程序设计模块...................................................................................................57
1．试题编号：J3-1 游戏网站——手动跳转焦点图 ..................................................57
2．试题编号：J3-2 电商网站——淘宝商品展示——经过小图看大图 ..................61
3．试题编号：J3-3 电商网站——手机展示..............................................................64
4．试题编号：J3-4 电商网站——走马灯..................................................................67
5．试题编号：J3-5 电商网站——图形随机验证码 ..................................................70
6．试题编号：J3-6 电商网站——关闭广告栏 ..........................................................73
7．试题编号：J3-7 电商网站——倒计时效果 ..........................................................76
8．试题编号：J3-8 电商网站——下拉菜单更换皮肤 ..............................................79
9．试题编号：J3-9 电商网站——当前日期和时间显示 ..........................................82
10．试题编号：J3-10 电商网站——简单的表单验证 ..............................................85
11．试题编号：J3-11 电商网站——二级下拉菜单 ..................................................88
12．试题编号：J3-12 电商网站——留言发布 ..........................................................91
13．试题编号：J3-13 电商网站——手风琴效果 ......................................................94
14．试题编号：J3-14 电商网站——选项卡效果 ......................................................97
15．试题编号：J3-15 电商网站——改变图片透明度 ............................................101
3
16．试题编号：J3-16 旅游网站设计——焦点图切换 ............................................104
17．试题编号：J3-17 网站设计——经过小图看大图 ............................................108
18．试题编号：J3-18 旅游网站设计——景点展示 ................................................111
19．试题编号：J3-19 旅游网站设计——无缝滚动 ................................................114
20．试题编号：J3-20 旅游网站设计——图形随机验证码 ....................................117
21．试题编号：J3-21 旅游网站设计——关闭广告栏 ............................................120
22．试题编号：J3-22 旅游网站设计——倒计时效果 ............................................123
23．试题编号：J3-23 旅游网站设计——网站换肤 ................................................126
24．试题编号：J3-24 旅游网站设计——当前日期和时间显示 ............................129
25．试题编号：J3-25 旅游网站设计——简单的表单验证 ....................................132
三、移动互联开发模块........................................................................................................135
1. 试题编号：J4-1 智能农业-启动页设计 ....................................................135
2. 试题编号：J4-2 智能农业-登录界面 ........................................................137
3. 试题编号：J4-3 智能农业-环境指标布局 ................................................139
4. 试题编号：J4-4 智能农业-历史数据查询 ................................................143
5. 试题编号：J4-5 智能农业-手动控制界面布局 ........................................145
6. 试题编号：J4-6 智能农业-系统设置界面布局 ........................................147
7. 试题编号：J4-7 智能农业-主界面布局 ....................................................150
8. 试题编号：J4-8-智能交通—登录界面布局 .............................................153
9. 试题编号：J4-9 智能交通-注册界面布局 ................................................155
10. 试题编号：J4-10 智能交通-网络设置界面布局 ......................................158
11. 试题编号：J4-11 智能交通-车辆 ETC 账户管理 ......................................160
12. 试题编号：J4-12-智能交通-红绿灯管理界面 .........................................163
13. 试题编号：J4-13 智能交通-账单管理 ......................................................165
14. 试题编号：J4-14 智能交通-系统环境指标布局 ......................................168
15. 试题编号：J4-15 智能交通-系统传感器实时数据布局 ..........................171
16. 试题编号：J4-16 智能交通-阈值设置功能布局 ......................................173
17. 试题编号：J4-17 智能交通-出行管理 ......................................................176
18. 试题编号：J4-18 智能交通-账户管理 ......................................................178
19. 试题编号：J4-19-智能交通-公交查询 .....................................................181
20. 试题编号：J4-20 智能交通-红绿灯管理 ..................................................184
21. 试题编号：J4-21 智能交通-违章数据分析 ..............................................186
22. 试题编号：J4-22 智能交通-生活指数界面布局 ......................................189
23. 试题编号：J4-23 智能交通-我的消息界面布局 ......................................191
24. 试题编号：J4-24 智能交通-个人中心布局 ..............................................194
25. 试题编号：J4-25 智能交通-生活助手界面 ..............................................196
4
二、Web 前端程序设计模块
Web前端程序设计模块要求学生能够在规定的抽查时间内通过实际操作完成
测试项目，测试学生以实际应用需求为背景的项目，按照网页设计规范，使用
相关设计处理软件，运用所提供的图片素材、文字素材和音乐素材等完成网页
交互的相关技能。
1．试题编号：J3-1 游戏网站——手动跳转焦点图
项目描述
A 网络科技有限公司是一家专注于游戏网站设计开发的专业型公司，在 2019
年公司承担了某游戏网站的设计和开发。假若你是 A 公司前端开发工程师，现要
求你根据所提供的素材和参考图片，设计并开发网站相关的页面效果。
在浏览一些游戏网站时经常会看到一些大的焦点图映入眼帘，不仅使整个网
站看起来更加美观，还增加了网站的点击量。
请完成一个手动跳转焦点图和相关任务，如图 J3.1.1 与 J3.1.2 所示。相
关素材见光盘前端程序设计相关素材\试题 J3-1\。
刚打开页面时，效果如图 J3.1.1 所示
图 J3.1.1 手动跳转焦点图 1
5
当鼠标移到第二个按钮时，效果如图 J3.1.2 所示。
图 J3.1.2 手动跳转焦点图 2
(1)任务描述
任务 1：请按要求完成页面结构设计
1)外部嵌套一个大盒子由<div>定义，类名叫 box。
2)大盒子下插入图 J3.1.1 所示的图片，图片由<img>标记定义。
3)按钮由无序列表<ul>定义。
任务 2：按要求完成样式设计
1) 外部嵌套的大盒子宽与高分别设置为 730 px 和 454px，页面居中，距离
顶部 100px。
2)两个切换按钮采用绝对定位，距离底部和右边均为 10px，按钮宽高均为
20px。
3)按钮盒子采用左浮动实现横排显示，设置适当外边距。
4)按钮上的文字为宋体，居中；背景色为#ccc；鼠标经过按钮时呈现手形。
任务 3：请按要求完成焦点切换效果
1)当鼠标点击按钮 1，背景图片切换为图 J3.1.1 所示，同时按钮 1 背景颜色
切换为粉色 pink。
2) 当鼠标点击按钮 2，背景图片切换为图 J3.1.2 所示，同时按钮 2 背景颜
色切换为粉色 pink。
作品提交要求：
1)在“e:\技能抽查提交资料\”文件夹内创建考生文件夹，考生文件夹的命
评论0