1.用bootstrap中的柵格做網頁布局的基本結構是什么?默認將一行分為多少列?
答案:容器中設置行,行內設置列.
默認將一行分為12個單元格(列)
2.如何編寫響應式網頁?
答案:
(1)聲明viewport元標簽
(2)所有容器/文字/圖片 使用相對尺寸
(3)流式布局+彈性布局
(4)使用CSS3 MediaQuery技術
3.同時監聽多個scss文件的命令是什么?
答案:node-sass -w scss文件夾 -o css文件夾
4.在scss中如何定義混合器以及引用?
答案:
@mixin 混合器名稱{ 樣式聲明 }
通過@include來使用混合器.
5.對於各類尺寸的設備,Bootstrap設置的class前綴分別是什么?
超小設備手機( <767px ): .col-xs-
小型設備平板電腦( >=768px ): .col-sm-
中型設備台式電腦( >=992px ): .col-md-
大型設備台式電腦( >1200px ): .col-lg-
6.Bootstrap如何設置響應式表格?
增加class="table-responsive"
7.使用Bootstrap激活或禁用按鈕要如何操作?
激活按鈕:給按鈕增加.active的class
禁用按鈕:給按鈕增加disabled="disabled"的屬性
8.Bootstrap有哪些關於<img>的class
(1) .img-rounded為圖片添加圓角
(2) .img-circle 將圖片變為圓形
(3) .img-thumbnail 縮略圖功能
(4) .img-responsive 圖片響應式(將很好地擴展到父元素)
9.Bootstrap中有關元素浮動及清除浮動的class?
class="clearfix" 清除浮動
10.Bootstrap如何制作下拉菜單?
(1)將下拉菜單包裹在class="dropdown"的<div>中;
(2)在觸發下拉菜單的按鈕中添加:class="btn-dropdown-toggle"
id="dropdownMenu1" data-toggle="dropdown"
(3)在包裹下拉菜單的ul中添加:
class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1"
(4)在下拉菜單的列表項中添加:role="presentation", 其中,下拉菜單的標題要添加
class="dropdown-header",選項部分要添加tabindex="-1".
11.Bootstrap如何制作按鈕組?
用class="btn-group"的<div>去包裹按鈕組;
class="btn-group-vertical"可設置垂直按鈕組.
12.Bootstrap中的導航都有哪些?
(1)導航元素:有class="nav nav-tabs"的標簽頁導航,還有class="nav nav-pills"的
膠囊式標簽頁導航;
(2)導航欄:class="navbar navbar-default" role="navigation";
(3)面包屑導航:class="breadcrumb"
13.Bootstrap中設置分頁的class?
默認的分頁:class="pagination"
14.Bootstrap中如何制作徽章?
<span class="badge">26</span>
15.Bootstrap中超大屏幕的作用是什么?
設置 class="jumbotron"可以制作超大屏幕,該組件可以增加標題的大小並增加
更多的外邊距.
16.Bootstrap網格系統列與列之間的間隙寬度是多少?
答案:間隙寬度為30px (一個列的每邊分別是15px).
17.用Bootstrap,如何設置文字的對齊方式?
class="text-center" 設置居中文本
class="text-right" 設置向右對齊文本
class ="text-left" 設置向左對齊文本