Bootstrap笔试题VIP

1、一、单选题 （针对以下题目，请选择最符合题目要求的答案。针对每一道题目，所有答案都选对，则该题得分，所选答案错误或不能选出所有答案，则该题不得分。每题 2.5分，共 80分。）1. Bootstrap 插件全部依赖是（ ）A. JavaScriptB. JQueryC. Angular JSD. Node JS2. 栅格系统小屏幕使用的类前缀是（ ）A. .col-xs- B. .col-sm- C. .col-md- D. .col-lg-3. 如下代码中，想要在超小屏幕和小屏幕显示两列，在中屏幕和大屏幕显示三列,三个div 的 class 正确的写法是（ ）<div class=&q

2、uot;row"><div class=" ">item1</div><div class=" "> item2</div><div class=" "> item3</div></div>A. col-sm-6 col-md-4， col-sm-6 col-md-4， col-sm-6 col-md-4B. col-sm-6 col-lg-4， col-sm-6 col-lg-4， col-sm-6 col-lg-4C. col-xs

3、-6 col-lg-4， col-xs-6 col-lg-4， col-xs-6 col-lg-4D. col-xs-6 col-md-4， col-xs-6 col-md-4， col-xs-6 col-md-44. 下面可以实现列偏移的类是（ ）A. .col-md-offset-*B. .col-md-push-*C. .col-md-pull-*D. .col-md-move-*5. 表单元素要加上什么类，才能给表单添加圆角属性，和阴影效果（）A. form-group B.form-horizontal C. form-inline D. form-control6. img-res

4、ponsive类可以让图片支持响应式布局，它的实现原理是（）A.设置了 max-width: 100%;和 height: auto;B. 设置了 max-width: 100%; 和 height: 100%;C. 设置了width: auto; 和 max-height: 100%;D. 设置了width: auto; 和 height: auto;7 .输入框组想加上图标，可以实现对表单控件的扩展的类是（）A. .input-group-btnB. .input-group-addonC. form-controlD.input-group-extra8 . 标签页垂直方向堆叠排列 ,

5、需要添加的类（）A.nav-vertical B.nav-tabs C.nav-pillsD.nav-stacked9 . 可以把导航固定在顶部的类是（）A. navbar-fixed-topB. navbar-fixed-bottomC. navbar-static-topD. navbar-inverse10 . 导航条在小屏幕会被折叠， 实现显示和折叠功能的按钮需要加什么（）A. 折叠按钮加 data-toggle= collapsed ，折叠容器需要加collapsed 类B. 折叠按钮加data-toggle= collapse ， 折叠容器需要加 collapse类C. 折叠按钮加

6、data-toggle= scroll ，折叠容器需要加 collapse类D. 折叠按钮加 data-spy= scroll ，折叠容器需要加 collapse 类11 .实现nav平铺整行，应该加哪个类（）A. nav-center B. nav-justified C. nav-left D. nav-right12 .模态框提供了哪些尺寸（）A. modal-xs modal-sm modal-md modal-lgB. modal-sm modal-md modal-lgC. modal-xs modal-smD. modal-sm modal-lg13 .如果你不需要模态框弹出时的

7、动画效果（淡入淡出效果）怎样实 现（）A.删掉.fade类即可B.添加删掉.fade类即可C.去掉.active类即可D.去掉.in类即可)B.添加 data-target=' scroll'D.添力口 data-dismiss= scroll”14 .怎样实现滚动监听事件（A.添力口 data-toggle= "scroll”C.添力口 data-spy=' scroll'15 .关闭modal的按钮应该加什么属性（）A.data-dismiss=' modal'B.data-toggle=' modal 'C. da

8、ta-spy= modal'D. data-hide='true'16 .下列不属于panel的三要素是()A.panel-heading B.panel-body C.panel-footer D. panel-content17 .用JavaScript怎样让轮播图从第二个图片开始播放()A. $('.carousel').carousel()B. $('.carousel').carousel(0)C. $('.carousel').carousel(1)D.$('.carousel').carous

9、el(2)18 .使用collapse实现手风琴，通过哪个属性关联整个面板组()A. data-parentB. data-toggleC. data-targetD. href19 .如何让轮播图在页面切换时有动画()A.添加in类B.添力口 fade类C.添力口 active类D.添力口 slide类20 .关于轮播图说法正确的是（）A.轮播图的页面切换索引从1开始B.下一页实现方式 data-slide-to= "prev”C.可以使用carousel-caption类为图片添加描述D.上一页实现方式 data-slide-to= "-1”21 .对于tooltip的

10、元素，data-placement的作用是（）A.工具提示条的显示大小B.工具提示条的显示位置C.工具提示条的显示动画D.工具提示条的显示颜色22 .弹出框元素：<button type="button" class="btn btn-lg btn-danger" data-toggle="popover" id= " mypopover ” title="this is my Popove element" data-animation=" true "data-content

11、="And some amazing content.">点我弹出 / 隐藏弹出框</button> ,对于title和data-content属性的作用，错误的是（）A. title可以不支持html标签B. title是弹出框的标题C. data-content是弹出框的内容D. data-content可以支持html标签D. data-dismiss23 .滚动监听哪个属性可以设置滚动条距离顶端的位置距离（）A. data-offsetY B. data-offset C.data-spy24 .标签页加了 fade给每个tab-pane使切换标签

12、页时有动画，那么怎样让第一个默认显示出来（）A.添加类activeB.添加类showC.添加类inD.添加类fadeIn25.怎样养tooltips通过点击事件弹出（）A. data-placement=" click"B. data-delay=" click”C. data-title= " click "D.data-trigger=" click”26 .怎样修改轮播图的页面切换的时间间隔（）A.data-interval B.data-pause C.data-wrap D.data-time27 .下列说法正确的是（）A.

13、 button组件能同时支持工具提示和控制模态框。B.不要在同一个元素上同时使用多个插件的data属性C.使用bootstrap插件不需要引用jQueryD. bootstrap插件不可以单个引入28 .怎样只关闭警告框的data-API （）A. $(document).off('.data-api') B.$(document).off('.alert-data-api')C. $(document).off('.data-api.alert') D.$(document).off('.alert.data-api')29 .

14、关于分页组件说法错误的是()A.使用类pagination来实现B一pagination-lg、.pagination-sm类提供了额外可供选择的尺寸。C. .disabled类不可用于翻页中的链接D. previous类和类next可以表示上一页、下一页30 .下列哪个类起徽章的作用()A.page-header B. jumbotron C. badge D. thumbnail31 .怎样为进度条创建条纹效果()A.添力口类 progress-bar-stripedB.添力口类 progress-barC.添力口类 progress-stripedD.添力口类 progressBar-s

15、triped32 .制作tab切换，要显示的内容要放在下方哪个容器里面()A. content B. tab-group C. tab-body D. tab-content 二，多选题（针对以下题目，请选择最符合题目要求的答案。针对 每一道题目，所有答案都选对，则该题得分，漏选答案则该题得2分, 选了错误答案则该题不得分。每题 4分，共20分。33 .关于bootstrap的布局容器说法正确的有（）A. .container类用于固定宽度并支持响应式布局的容器。B. .container-fluid 类用于 100% 宽度，占据全部视口（ viewport） 的容器。C. .containe

16、r和.container-fluid 可以互相嵌套D.布局容器仅提供了 .container和.container-fluid两种容器34 .如果想要绘制带边框的条纹状的表格需要添加的类有（）A. table-condensedB. table-hoverC.table-borderedD. table-striped35.对于下拉菜单说法正确的是（）<d£v <><buTt»n <.lg，Jb5 b*tn -default drc>pdMni - toggle" Typfii"buttsfi" id*

17、9;"介白 pEtwnHmu 广- t4（g.le>'dQpd wn" >< pan rlassciretR></span></buttcni>< ul ciassw"drGpd&ffi -meru" roe»-meftu* aria -labellectb7-"dropdowrirtnu 1">< 11 rale "pre s-e ntat ion j ca rele "ffienuitM* tabifidiBx»

18、;li -1- href "fl- >Act/a ></li >«li. iPfhle-Hpi'tftt*t"*sfnyIt* f .广 hef*" Art«tKer cti中立打< 11 H pr a tt n tat ion - > c * r&l*wHwnuitt* 工21 曲就等、广 href »* >s»rtih 1 frf el» ”卡/+ x/1 外< li rale*h pr（E sc n tat ten > < * rel r "wnui t c-en tabiffitox"" "1" href *f >Scpisr «t cd c/ul>A.表示有四个下拉选项的下拉菜单B.<span class= 'caret' ></span可以去掉而不影响功能C可以加入pull-right使菜单右对齐D.可以加入dropdown-menu-right使菜单右对齐36 .下列关于