广东省职业技能等级认定证书试卷样题计算机程序员-Web前端开发(四级)A-01.docx

计算机程序员-Web前端开发（级）

技能试卷（A）
注意事项
1、考试时间：180分钟。
2、请在试卷标封处填写姓名、身份证号、准考证号和所在单位的名称。
你是开发公司的员工，请根据设计稿完成页面布局，特效开发、及后台数据渲染。某企业网站效果图如图1所示：
上海信念行五金有限公司
WANGHAJ HI HF HARDWARE CO. HD
中且抑共

中且抑共
信念行
HSSWI.闻稣来 全心全息为客户眼务
aw己5切方!妹骨■及世霁此 初彳
仙分麦松怕・uHKUirtJrtQKigm机烦点・

aw己5切方!妹骨■及世霁此 初彳
仙分麦松怕・uHKUirtJrtQKigm机烦点・
点*us**..
e*五金
手就工.龙lie-w s三财w
7018 TXffKej

K» :I V?« (I *2 : OTS；8U3?»O M : 441U2?27«q(Hom
c 2009 2WO X^ooKo* Al 妙0 mtwd.
第一题：开发环境搭建及项目配置（10分）打开xampp,开启mysql和apache服务，使用localhost可访问网站，以考号后4位-l-l.jpg
保存（5分）；2.将网页放在服务器目录下，建立css、js、image等文件夹，以考号后4位-l-2.jpg保存

2.将网页放在服务器目录下，建立css、js、image等文件夹，以考号后4位-l-2.jpg保存

（5 分）； 台■电脑► BOOTCAMP (C:) ► xampp ► htdocs ► web
名称*修改日期css image

css image
2021/5/28 11:47
2021/5/28 11:48
2021/5/28 11:48
第二题：网站页面布局（50分）
按效果图进行网站各个页面布局：
1. 使用符合w3c标准的标签布局（5分）；企业网首页整体框架布局（5分）；
2. 页面导航使用ul,li,a布局，可以跳转到网站首页和简介页面（5分）：
耻u页公司断介新伺g户品曜示销售网书在知牟 ttiata峡基我们完成搜索框，可以输入文字（5分）：
5. 完成首页头部栏目布局（5分）；
'上海信念行五金有限公司 SHANGHAI BFIKF HARDWARE CO. ITD
完成网站主体banner模块布局（5分）；
信念行立足深圳.同步未来 全心全意为客户88务
6. 完成网站企业简介图片内容模块布局（4分）；及lh独念行工■骨曜公司定一左集户品开友.tMIf-tt 的&金工■吉11化企ii・自1湖霉成立以主,您az孙由.公司 占他碰.己皿万平方卑・业务道及世霁近x^tssmE- y 东帛亚w二分兰帆怕•以惠欢设御丞槌们吐仇免・
7. 页面上所有文字可选（除logo、banner.产品图）（4分）；完成企业网底部模块布局（4分）；
8. 完成网站侧边栏新闻公告模块布局（4分）；
米尔斯工具新闻公告妍〉。柘展2奶车五企渠坦祖祐恩雄藤重耍2021-）5-27
o印度未来许肉投3®亿卢比发腐机床工具2021^5-27。200^解枷濒融鼠1W泌5-2?
O手TT且发皿龄应咄2021-05-27。手幼工岚企也3 “零冬”的三条注汶20急-05-27
9. 完成企业网站公司简介分页布局（4分）；第三题：网站交互功能开发（20分）
按照下面要求进行网站交互功能开发:
1. 完成焦点图点击切换特效（5分）；完成焦点图3秒切换特效（5分）：
2. 完成点击搜索提示不能为空（5分）；鼠标进过导航显示高亮效果（5分）；
第四题：网站后台功能开发（20分）
按照网站后台功能要求进行开发：
1. 使用phpmyadmin管理MySQL数据库，创建数据库cms ,创建新闻公告表news,, 以考号后4位-4-l.jpg保存。（5分）数据表添加字段，表结构如下，以考号后4位-4-2.jpg保存（5分）
表名称：news
字段名称
字段类型
说明
id
整型 int(ll)
ID,自增，主键
title
字符串 varchar(256)
标题
content
文本text
内容（可为空）
pub_a(
时间戳timestamp
发布时间
为数据表添加5条公告信息（素材在文本公告信息中），以考号后4位-4-3.jpg保存（5分）;
2. 将数据信息渲染到页面中，php代码以考号后4位-4-4.jpg保存（5分）；