第三篇 1+X考证 Web前端测试题（bootstrap篇）

* 这一篇的内容主要是针对bootstrap篇的测试题目，加强练习；

*如果遇到不会的可以试着查看文档或评论（ 文档：html" class="superseo">Bootstrap )

一、单选题

1、下列可以实现偏移的类是（ D ）

A. .col-md-push-*

B. .col-md-move-*

C. .col-md-pull-*

D. .col-md-offset-*

[ 知识点：bootstrap响应式列的重置可以用 ；偏移列是一个用于更专业布局的有用功能，.col-xs-* 类不支持偏移,但可以通过使用一个空的单元格来实现该效果。为了能在较大的屏幕上使用偏移，可以使用 .col-md-offset-* 类,这些类会把一个列的左外边距（margin）增加 * 列，其中 * 范围是从 1 到 11，测试：菜鸟教程在线编辑器。嵌套列在嵌套的网格，添加一个新的 .row，并在一个已有的 .col-md-* 列内添加一组 .col-md-* 列。被嵌套的行应包含一组列，这组列个数不能超过12（并无要求必须占满12列）。列排序，改变带有 .col-md-push-* 和 .col-md-pull-* 类的内置网格列的顺序，其中 * 范围是从 1 到 11，使用 .col-md-push-* 和 .col-md-pull-* 类来互换这两列的顺序 ]

2、关闭modal的按钮应该加什么属性（ C ）

A. data-dismiss = 'modal'

B. data-spy = 'modal'

C. data-toggle = 'modal'

D. data-hide = 'true'

[ 知识点：data-dismiss="modal"，是一个自定义的 HTML5 data 属性。在这里它被用于关闭模态窗口。data-toggle="modal"，HTML5 自定义的 data 属性 data-toggle 用于打开模态窗口。data-spy = 'modal'，监听模态框，data-hide = 'true'，使其隐藏。]

3、在BookStrap中，栅格系统的标准用法（ C ）是错误的。

A.

B.

C.

D.

[ 知识点：栅格化（网格）基本结构

     
         
             
     
        ... 
 

]

4.以下不属于Bootstrap的样式设置（ D ）

A. table-hover

B. table-responsive

C. table

D. radio

5.在Bootstrap中，下列（ D ）不属于按钮尺寸

A. .btn-lg

B. .btn-xs

C. .btn-sm

D. .btn-md

[ 知识点：-lg(大按钮)；-xs(超小按钮)；-sm(制作一个小按钮)

]

6.BootStrap中，下列（ D ）类不属于button的预定义样式。

A. .btn-info

B. .btn-link

C. .btn-success

D. .btn-warp

[解析：看一下第五题的图]

7.BootStrap内置了一套响应式，移动设备优先的流式栅格系统，随着屏幕设备或视口尺寸的增加系统会自动分为最多（ B ）列。

A.8

B.12

C.16

D.10

8.Bootstrap表单控件样式为（ D ）

A. form - inline

B. form-group

C. form-group-sm

D. form-control

9.以下关于BootStrap格栅描述不正确的是（ C ）

A.栅格系统默认每一行最多12列

B.“justify-content-类型” 可在行的div标签中实现水平布局

C.“justify-items-类型” 可在行的div标签中实现水平布局

D.“oftset-数字” 可实现格栅偏移

10.表单元素要加上什么类，才能给表单添加圆角属性，和阴影效果是（ D ）

A. form-horizontal

B. form-inline

C. form-group

D. form-control

二、多选题

1.在BootStrap中，栅格系统的标准用法（ ACD ）是正确的

A.

B.

C.

D.

[ 知识点：栅格化（网格）基本结构

     
         
             
     
        ... 
 

.row必须包含在.container容器中，row中可以添加.column列，.column中可以嵌套.row行

]

2.在BootStrap中，下列（ BCD ）属于图片处理的类。

A. .img-radius

B. .img-thumbnail

C. .img-rounded

D. .img-circle

[ 知识点：元素添加类

 ]

3.在BootStrap中，以下的（ BD ）是文本对齐的方式。

A. text-middle

B. text-right

C. .text-bottom

D. text-justify

[ 知识点：

]

4.在BootStrap中，关于响应栅格系统（ CD ）的描述是错误的。

A. .col-sm- : 小屏幕、平板（>=768px）

B. .col-md- : 中等屏幕（>=992px） 

C. .col-sx-: 超小屏幕（<768px）

D. .col-big- : 大屏幕（>=1200px）

[ 知识点：超小屏幕：.col-xs- ；大屏幕：.col-lg-；

]

5.以下属于BootStrap栅格布局容器的有（ AB ）

A.

B.

C.

D.

 [ 知识点：.container 类用于固定宽度并支持响应式布局的容器，.container-fluid为流式布局容器]

三、判断题

1.BootStrap允许以两种方式显示代码：第一种 标签，第二种是

标签。 （）
 
 
 

谢谢观看！ 点赞+关注哦
 
完！
					
										


					

						
欢迎分享，转载请注明来源：内存溢出
原文地址: http://outofmemory.cn/web/944879.html