admin 管理员组文章数量: 1087139
2024年6月13日发(作者:古代好听的颜色名字)
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
考试科目
命题人: 审阅人:
(2021-2022 学年第 一 学期期末考试)
响应式Web应用前端开发教程期
末考试卷及答案
-
-
-
-
-
-
-
-
-
-
-
一、填空(5分,每空1分)
-
-
-
-
-
-
-
-
-
-
-
-
-
目
-
-
-
科
-
-
-
试
-
-
-
考
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
线
-
-
-
-
-
-
-
-
-
名
-
-
姓
订
-
-
-
-
-
-
-
-
-
-
-
装
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
号
-
-
-
学
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
级
-
-
-
班
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
第1页,共31页
1、jQuery默认的缩写符号是 。
2、Bootstrap设置右侧外边距为1倍$spacer 。
3、Bootstrap信息提示框基础类是 。
4、jQuery3.2.1版本中推荐使用 为元素绑定事件和处理函数,使用
函数解除绑定。
二、单选题(30分,每题3分)
1、设置Bootstrap卡片体中副标题的类是( )
A..title
B..subtitle
D..card-title C..card-subtitle
2.、jQuery设置元素样式的方法是( )
A.first()
C.css()
B.eq()
D.style()
3、Bootstrap4通过为卡片组的外包裹元素设置类( )实现手风琴效果
A..accordion
C..card-group
B..card
D..streched-card
4、Bootstrap4设置文本居右的类是( )
A.text-right
C.right-text
B.align-right
D.right-align
5、Bootstrap巨幕基础类是( )。
A..jump
C、.jumb
B、.jumbotron
D、.jumbotron-fluid
6、Bootstrap圆圈形加载动画的基础类是
A..spinner
C. .spinner-grow D..spinner-border
7、中中文字的占位符是( )
A.@cword
C.@cletter
B.@ccentence
D.@ctext
B..spinner-circle
8、可以使图片呈现缩略图效果的类是( )
A..img
B..img-shrink
D..img-thumbnail C..img-fluid
9、 使用下列哪个方法可以以滑动效果显示HTML元素( )。
第2页,共31页
A.slideToggle()
C.slideUp()
B.slideDown()
D.slie()
10. Bootstrap提供了一系列的对齐样式,表示超出屏幕部分不换行的样式是( )
A. text-center
C . text-auto
B. text-justify
D. text-nowrap
三、多选题(10分,每题2分)
1、下列哪些是正确的BootStrap文本类( )。
A. .text-primary
C. . text-danger
B. . text-info
D. . text-red
2、下列那些是BootStrap定义的主题颜色( )。
A. .blue
C. .warning
B .orange
D. muted
3、下列正确的定位相关的Bootstrap类是( )。
A. .position-static
B ..position-relative
D. .position-sticky C. .position-absolute
4、下列Bootstrap断点设置与像素对应正确的是( )。
A. sm(540px)
C. md (720px)
B .xl(1200px)
D. lg(992px)
5、下列哪些jQuery方法可以向指定元素中添加元素( )。
A append()
C after()
B prepend()
D before()
四、判断题(20分,每题2分)
1、( )BootStrap内置了一套响应式、移动设备优先的流式栅格系统,最多24列
2、( )Ajax请求成功时触发局部事件success。
3、( )语法中的“jQuery”是大小写敏感的。
4、( )可以在导航链接标签配置disable类禁用Bootstrap选项卡。
5、( )文件名中含有“min”的Bootstrap库文件经过“压缩”减小了文件大小。
第3页,共31页
6、( ).one()为指定元素绑定事件和处理函数。每个元素可多次运行事件处理器函
数。
7、( )Bootstrap媒体对象只能实现左图右文的图文单元。
8、( )事件由目标元素向祖先元素逐级传递,直到DOM根节点的机制称为事件捕
获。
9、( )Bootstrap4.6的组件行为是不依赖jQuery的。
10、( )媒体对象组件需要设置“.positon-relative”类来支持延展链接。
五、问答题(25分)
1、试述响应式布局的优缺点(5分)
2、列出至少5中jQuery选择器并简述其功能。(5分)
3、试列举Bootstrap图标的三种用法。(5分)
第4页,共31页
4、列举5种具有JS行为的Bootstrap组件。(5分)
5、试述“互联网+”创业、创新的理解,以及相关的创业、创新思路。(5分)
第5页,共31页
六、程序填空题(10分)
1、补足下列空白出,采用Bootstrap4卡片组件实现上图下文的图文单元,设置延展链接,
超链效果在整个卡片区域有效。(5分,每空1分)
2、将代码空白的部分(要求使用jQuery)补充完整,完成如下要求的功能:(5分)
1)表格首行和尾行的颜色为绿色(green),数据行做斑马纹效果底色为浅绿色
(lightgreen)
2)表格最后一个单元格中显示所有“食品类”商品的价格总和。
如下图所示
第6页,共31页
第7页,共31页
编号 | 分类 | 名称 | 价格(元) |
---|---|---|---|
01 | 食品 | 农夫山泉矿泉水 | 2.00 |
02 | 日用品 | 洗发水 | 25.00 |
03 | 娱乐休闲 | 暑假旅游 | 5000.00 |
04 | 食品 | 面包 | 20.00 |
总额 | 20.00 |
第8页,共31页
第9页,共31页
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
考试科目
试卷答案(A卷)
命题人: 审阅人:
(2021-2022 学年第 一 学期期末考试)
适用专业
班级 (年级)
-
-
-
-
-
-
-
-
-
-
一、填空(5分,每空1分)
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
目
-
-
-
科
-
-
-
试
-
-
-
考
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
线
-
-
-
-
-
-
-
-
-
名
-
-
姓
订
-
-
-
-
-
-
-
-
-
-
-
装
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
号
-
-
-
学
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
级
-
-
-
班
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
第10页,共31页
1、$
2、mr-3
3
、toast
4、on()、off()
二、单选题(30分,每题3分)
1、
C 2、C 3、A . 4、A 5、B.
6、B. 7、A 8、D. 9、C 10、D.
三、多选题(10分,每题2分)
1、AB
C 2、CD 3、
AB
CD. 4、BD 5、ABCD.
四、判断题(20分,每题2分)
1、X 2、√ 3、√ 4、X 5、√
6、X 7、X 8、X 9、X 10、√
五、简答题(25分)
1、试述响应式布局的优缺点(5分)
答:
优点:
面对不同分辨率设备灵活性强
能够快捷解决多设备显示适应问题
缺点:
兼容各种设备工作量大,效率低下
代码累赘,会出现隐藏无用的元素,加载时间加长
2、.列出至少5种jQuery选择器并简述其功能(5分)
答:
选择器
id选择器
类选择器
具 体 描 述
根据id选取对应的html元素
根据应用的css类选取对应的html元素
第11页,共31页
标签名选择器
祖先后代选择器
父子选择器
prev~siblings选择器
prev+next前后选择器
根据标签的名称选取对应的html元素
选择指定祖先元素的所有指定类型的后代元素
选择指定父元素的所有指定类型的子元素
选择指定prev元素后的根据siblings过滤的元素
选择指定prev元素后的所有next元素
上表中列出的仅供参考,答对任意5个选择器均可得分。
3、试列举Bootstrap图标的三种用法。(5分)
答:
Svg HTML引用,在HTML文件中引用目标图标的svg html代码。
作为svg图片引用,需要下载或者网络引用目标图标的svg文件。
以web字体的方式引用,需要下载或者网络引用图标库样式文件,并配置目标图
标类。
4、列举5种具有JS行为的Bootstrap组件。(5分)
答:
轮播器、下拉菜单、模态框、折叠面板、选项卡导航
5、试述“互联网+”创业、创新的理解,以及相关的创业、创新思路。(5分)
开放性答案
六、编程题(10分)
1、补足下列空白出,采用Bootstrap4卡片组件实现上图下文的图文单元,设置延展链接,
超链效果在整个卡片区域有效。(5分,每空1分)
2、将代码空白的部分补充完整(要求使用jQuery),完成如下要求的功能:(5分)
1、表格首行和尾行的颜色为绿色(green),数据行做斑马纹效果底色为浅绿色
(lightgreen)
2、表格最后一个单元格中显示所有“食品类”商品的价格总和。
如下图所示
评分标准
jQuery选择器使用
jQuery设置样式
1分
1分
1分
1分
1分
jQuery循环流程控制
jQuery获取文本并计算
jQuery输出
编号 | 分类 | 名称 | 价格(元) |
---|---|---|---|
01 | 食品 | 农夫山泉矿泉水 | 2.00 |
02 | 日用品 | 洗发水 | 25.00 |
03 | 娱乐休闲 | 暑假旅游 | 5000.00 |
04 | 食品 | 面包 | 20.00 |
总额 | 20.00 |
第15页,共31页
草稿纸页
(此页与试卷一起装订,作为试卷第9页)
第16页,共31页
版权声明:本文标题:响应式Web应用前端开发教程AB卷期末考试卷及答案2套 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://roclinux.cn/b/1718290963a719764.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论