Bootstrap模塊考試題
一、單選題(針對以下題目,請選擇最符合題目要求的答案。針對每一道題目,所有答案都選對,則該題得分,所選答案錯誤或不能選出所有答案,則該題不得分。每題2.5分,共80分。)
1.Bootstrap插件全部依賴是(B)
A.JavaScript
B.JQuery
C.Angular JS
D.Node JS
2.柵格系統小型設備平板電腦屏幕使用的類前綴是(B)
A..col-xs- B..col-sm- C..col-md- D..col-lg-
- 如下代碼中,想要在超小屏幕和小屏幕顯示兩列,在中屏幕和大屏幕顯示三列, 三個div的class正確的寫法是D( xs
<div_class=”row'>
<div class=””>item 1</div>
<div class=””>item 2</div>
<div_class=””>item 3</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 col-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-4
4.下面可以實現列偏移的類是()
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-control
6.img-responsive類可以讓圖片支持響應式布局, 它的實現原理是()
A.設置了max-width:100%和height:auto;
B.設置了max-width:100%;和height:100%;
c.設置了with:auto;和max-height:100%;
D.設置了width:auto;和height:auto;
7.輸入框組想加上圖標,可以實現對表單控件的擴展的類是()
A.input-group-btn B.input-group-add on
C.form-control D.input-group-extra
8.標簽頁垂直方向堆疊排列,需要添加的類()
A.nav-vertical B.nav-tabs C.nav-pills D.nav-stacked
9.可以把導航固定在頂部的類是()
A.navbar-fixed-top
B.navbar-fixed-bottom
C.navbar-static-top
D.navbar-inverse
10.導航條在小屏幕會被折疊,實現顯示和折疊功能的按鈕需要加什么()
A.折疊按鈕加data-toggle='collapsed’, 折疊容器需要加collapsed類
B.折疊按鈕加data-toggle='collapse', 折疊容器需要加collapse類
c.折疊按鈕加data-toggle='scroll’, 折疊容器需要加collapse類
D.折疊按鈕加data-spy='scroll’, 折疊容器需要加collapse類
11.實現nav平鋪整行, 應該加哪個類()
A.nav-center B.nav-justified_C.nav-left D.nav-right 組件中
12.模態框提供了哪些尺寸()
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-lg
13.如果你不需要模態框彈出時的動畫效果(淡入淡出效果)怎樣實現()
A.刪掉.fade類即可
B.添加刪掉.fade類即可
C.去掉.active類即可
D.去掉.in類即可
14.怎樣實現滾動監聽事件()
A.添加data-toggle=“scroll” B.添加data-target=’scroll'
C.添加data-spy=’scroll' D.添加data-dismiss=”scroll”
15.關閉modal的按鈕應該加什么屬性()
A.data-dismiss=’modal' B.data-toggle=’modal‘
C.data-spy=modal’ D.data-hide='true'
16.下列不屬於panel的三要素是()
A.panel-heading B.panel-body C.pane-footer D.panel-content
17.用JavaScript怎樣讓輪播圖從第二個圖片開始播放()
A.$('.carousel') .carouse() B.S('.carousel') .carousel(0)
C.S(.carousel') .carousel(1) D.S(.carousel') .carousel(2)
18.使用collapse實現手風琴, 通過哪個屬性關聯整個面板組(
A.data-parent
B.data-toggle
C.data-target
D.href
19.如何讓輪播圖在頁面切換時有動畫()
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的元素, data-placement的作用是()
A.工具提示條的顯示大小
B.工具提示條的顯示位置
c.工具提示條的顯示動畫
D.工具提示條的顯示顏色
22.彈出框元素:<button type=”button”class=”btn btn-lgbtn-danger”data-toggle=”popover”id=my popover”title=”this is my Popov e element”data-animation=true”data-content=”And some amazing content.”點我彈出/隱藏彈出框</button>, 對於title和data-content屬性的作用, 錯誤的是()
A.title可以不支持html標簽
B.title是彈出框的標題
C.data-content是彈出框的內容
D.data-content可以支持html標簽
23.滾動監聽哪個屬性可以設置滾動條距離頂端的位置距離()
A.data-offset Y B.data-offset C.data-spy D.data-dismiss
24.標簽頁加了fade給每個tab-pane使切換標簽頁時有動畫, 那么怎樣讓第一個默認顯示出來()
A.添加類active
B.添加類show
C.添加類in
D.添加類fade ln
25.怎樣養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-time
27.下列說法正確的是()
A.button組件能同時支持工具提示和控制模態框。
B.不要在同一個元素上同時使用多個插件的data屬性
C.使用bootstrap插件不需要引用j Query
D.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.關於分頁組件說法錯誤的是(
A.使用類pagination來實現
B..pagination-lg、.pagination-sm類提供了額外可供選擇的尺寸。
C..disabled類不可用於翻頁中的鏈接
D.previous類和類next可以表示上一頁、下一頁
30.下列哪個類起徽章的作用()
A.page-header B.jumbotron C.badge D.thumbnail
31.怎樣為進度條創建條紋效果()
A.添加類progress-bar-striped
B.添加類progress-bar
C.添加類progress-striped
D.添加類progressBar-striped
32.制作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..container和.container-fluid可以互相嵌套
D.布局容器僅提供了.container和.container-fluid兩種容器
34.如果想要繪制帶邊框的條紋狀的表格需要添加的類有()
A.table-condensed
B.table-hover
C.table-bordered
D.table-striped
35.下列關於柵格系統說法正確的有()
A.柵格系統每一行不能少於12列
B.通過“行(row) ”在水平方向創建一組“列(column) ”。
C.行(row) ”必須包含在.container(固定寬度) 或.container-fluid(100%寬度) 中, 以便為其賦予合適的排列(alig ment) 和內補(padding) 。
36.下列哪些是輔助類()
A.text-muted B.text-primary C.text-info D.text-danger
37.下列哪個類是在手機端隱藏指定元素
A hidden-lg B hidden-xs C hide D show