就業(yè)班移動(dòng)web第七天
一、媒體查詢
根據(jù)設(shè)備的變化谨朝，設(shè)置差異式布局卤妒！
開發(fā)寫法：
@media （媒體特性-一般寫max-min寬度）{
選擇器 { 樣式
}
}
二、bootstrap（UI框架）
一叠必、使用方法：
1.去bootstrap官網(wǎng)下載文件荚孵，把需要的css和js文件引入到項(xiàng)目代碼中！
注意：css用link引入纬朝，js在body用<script>標(biāo)簽引入 收叶！js順序：先用jq.js，后用bootstrap.js
2.你需要什么組件就去復(fù)制什么組件共苛！也可以定制化判没，定制化需要重新下載覆蓋之前的bootstrap文件
【 container 是bootstrap提供的版心的類名】
【container-fluid 是bootstrap提供的通欄的類名】
【row 是bootstrap提供給版心或者通欄使用的，目的就是為了清除設(shè)置好的內(nèi)邊距 】
二隅茎、bootstrap柵格系統(tǒng)
a柵格化是指將整個(gè)網(wǎng)頁(yè)的寬度分成若干等份
BootStrap3默認(rèn)將網(wǎng)頁(yè)分成12等份
寫法：class=" col-尺寸-*"
- .col-xs-* 這是超小屏幕類（<768px）澄峰，類似手機(jī)等設(shè)備。
- .col-sm-* 這是小屏幕設(shè)備類（≥768px且<992px）辟犀，類似平板設(shè)備俏竞。
- .col-md-* 這是中型設(shè)備類（≥992px且<1200px）
- .col-lg-* 這是大型設(shè)備類（≥1200px）
image.png
