Bootstrap筆試題

1、一、單選題（針對以下題目，請選擇最符合題目要求的答案。針對每一道題目，所有答案都選對，則該題得分，所選答案錯(cuò)誤或不能選出所有答案，則該題不得分。每題2.5分，共80分。）1. Bootstrap 插件全部依賴是（ ）A. JavaScriptB. JQueryC. Angular JSD. Node JS2. 柵格系統(tǒng)小屏幕使用的類前綴是（ ）A. .col-xs- B. .col-sm- C. .col-md- D. .col-lg-3. 如下代碼中，想要在超小屏幕和小屏幕顯示兩列，在中屏幕和大屏幕顯示三列,三個(gè)div的class正確的寫法是（ ）<div class="ro

2、w"> <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-4 B. col-sm-6 col-lg-4，col-sm-6 col-lg-4，col-sm-6 col-lg-4 C. col-xs-6 co

3、l-lg-4，col-xs-6 col-lg-4，col-xs-6 col-lg-4 D. col-xs-6 col-md-4，col-xs-6 col-md-4，col-xs-6 col-md-44. 下面可以實(shí)現(xiàn)列偏移的類是（ ）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-responsi

4、ve類可以讓圖片支持響應(yīng)式布局,它的實(shí)現(xiàn)原理是（ ）A.設(shè)置了max-width: 100%;和 height: auto; B. 設(shè)置了max-width: 100%; 和 height: 100%; C. 設(shè)置了width: auto; 和 max-height: 100%; D. 設(shè)置了width: auto; 和 height: auto; 7.輸入框組想加上圖標(biāo)，可以實(shí)現(xiàn)對表單控件的擴(kuò)展的類是（ ）A. .input-group-btn B. .input-group-addon C. form-control D. input-group-extra8. 標(biāo)簽頁垂直方向堆疊排列,需

5、要添加的類（）A.nav-vertical B.nav-tabs C.nav-pills D.nav-stacked9. 可以把導(dǎo)航固定在頂部的類是（）A. navbar-fixed-topB. navbar-fixed-bottomC. navbar-static-topD. navbar-inverse10. 導(dǎo)航條在小屏幕會被折疊，實(shí)現(xiàn)顯示和折疊功能的按鈕需要加什么（）  A. 折疊按鈕加data-toggle=collapsed，折疊容器需要加collapsed類B. 折疊按鈕加data-toggle=collapse，折疊容器需要加collapse類C. 折疊按鈕

6、加data-toggle=scroll，折疊容器需要加collapse類D. 折疊按鈕加data-spy=scroll，折疊容器需要加collapse類11. 實(shí)現(xiàn)nav平鋪整行，應(yīng)該加哪個(gè)類（） A. nav-center B. nav-justified C. nav-left D. nav-right 12. 模態(tài)框提供了哪些尺寸（ ）A. modal-xs modal-sm modal-md modal-lg B. modal-sm modal-md modal-lg C. modal-xs modal-sm D. modal-sm modal-lg13. 如果你不需要模態(tài)框彈出時(shí)的動(dòng)

7、畫效果（淡入淡出效果）怎樣實(shí)現(xiàn)（ ）A. 刪掉 .fade 類即可 B. 添加刪掉 .fade 類即可 C. 去掉 .active 類即可 D去掉.in 類即可14. 怎樣實(shí)現(xiàn)滾動(dòng)監(jiān)聽事件（ ）A. 添加data-toggle=“scroll” B. 添加data-target=scroll C. 添加data-spy=scrollD. 添加data-dismiss=”scroll”15. 關(guān)閉modal 的按鈕應(yīng)該加什么屬性（） A. data-dismiss=modal B.data-toggle=modal C. data-spy=modal D. data-hide='

8、;true' 16. 下列不屬于panel的三要素是（）A. panel-headingB. panel-bodyC. panel-footer D. panel-content17.用JavaScript怎樣讓輪播圖從第二個(gè)圖片開始播放（ ） A. $('.carousel').carousel() B. $('.carousel').carousel(0) C. $('.carousel').carousel(1) D.$('.carousel').carousel(2)18. 使用collapse實(shí)現(xiàn)手風(fēng)琴，通過哪個(gè)

9、屬性關(guān)聯(lián)整個(gè)面板組（ ）A. data-parentB. data-toggleC. data-targetD. href19. 如何讓輪播圖在頁面切換時(shí)有動(dòng)畫（ ）A. 添加in類B. 添加fade類C. 添加active類D.添加slide類20.關(guān)于輪播圖說法正確的是（）。 A.輪播圖的頁面切換索引從1開始B. 下一頁實(shí)現(xiàn)方式data-slide-to=“prev”C.可以使用carousel-caption類為圖片添加描述D. 上一頁實(shí)現(xiàn)方式data-slide-to=“-1”21. 對于tooltip的元素，data-placement的作用是（）A. 工具提示條的顯示大小 B. 工

10、具提示條的顯示位置 C. 工具提示條的顯示動(dòng)畫 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="And some amazing content.">點(diǎn)我彈出/隱藏彈出框&

11、lt;/button>，對于title和data-content屬性的作用，錯(cuò)誤的是（）A. title可以不支持html標(biāo)簽B. title是彈出框的標(biāo)題C. data-content是彈出框的內(nèi)容D. data-content可以支持html標(biāo)簽23. 滾動(dòng)監(jiān)聽哪個(gè)屬性可以設(shè)置滾動(dòng)條距離頂端的位置距離（ ）A. data-offsetY B. data-offset C.data-spy D. data-dismiss24. 標(biāo)簽頁加了fade給每個(gè)tab-pane使切換標(biāo)簽頁時(shí)有動(dòng)畫，那么怎樣讓第一個(gè)默認(rèn)顯示出來（）A. 添加類activeB. 添加類showC. 添加類inD.

12、添加類fadeIn25. 怎樣養(yǎng)tooltips通過點(diǎn)擊事件彈出（ ） A. data- placement=”click” B. data- delay=”click” C. data- title=”click” D.data-trigger=”click” 26. 怎樣修改輪播圖的頁面切換的時(shí)間間隔（ ）A.data- interval B.data- pause C.data- wrap D.data-time27. 下列說法正確的是（ ）A. button 組件能同時(shí)支持工具提示和控制模態(tài)框。B. 不要在同一個(gè)元素上同時(shí)使用多個(gè)插件的 data 屬性C. 使用bootstrap插件不

13、需要引用jQueryD. bootstrap插件不可以單個(gè)引入28. 怎樣只關(guān)閉警告框的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. 關(guān)于分頁組件說法錯(cuò)誤的是（ ） A使用類pagination來實(shí)現(xiàn) B.pagination-lg、.pagination-sm類提

14、供了額外可供選擇的尺寸。 C.disabled 類不可用于翻頁中的鏈接 Dprevious類和類next可以表示上一頁、下一頁 30.下列哪個(gè)類起徽章的作用（ ）A.page-header B. jumbotron C. badge D. thumbnail31. 怎樣為進(jìn)度條創(chuàng)建條紋效果（ ）A. 添加類progress-bar-stripedB. 添加類progress-barC. 添加類progress-stripedD. 添加類progressBar-striped32. 制作tab切換，要顯示的內(nèi)容要放在下方哪個(gè)容器里面（） A. content B. tab-group C. ta

15、b-body D. tab-content二，多選題 (針對以下題目，請選擇最符合題目要求的答案。針對每一道題目，所有答案都選對，則該題得分，漏選答案則該題得2分，選了錯(cuò)誤答案則該題不得分。每題4分，共20分。33.關(guān)于bootstrap的布局容器說法正確的有（ ）A. .container 類用于固定寬度并支持響應(yīng)式布局的容器。B. .container-fluid 類用于 100% 寬度，占據(jù)全部視口（viewport）的容器。C. .container和.container-fluid可以互相嵌套D.布局容器僅提供了.container和.container-fluid兩種容器34. 如果想要繪制帶邊框的條紋狀的表格需要添加的類有（ ）A. table-condensedB. table-hover C. table-bordered D. table-striped35. 對于下拉菜單說法正確的是( )A.表示有四個(gè)下拉選項(xiàng)的下拉菜單 B.<span class=caret></span 可以去掉而不影響功能C.可以加入pull-right使菜單右對齊 D.可以加入dropdown-menu-right使菜單右對齊36.下列關(guān)于柵格系統(tǒng)說法正確的有（ ） A. 柵格系統(tǒng)每一行不能少于12列B. 通過“行（row）”在水平方