4.3響應(yīng)式布局、bootstrap

一、響應(yīng)式布局

能夠根據(jù)設(shè)備寬度的變化，設(shè)置差異化樣式

在不同寬度的視口下不同的布局方式

@media（媒體特性）{

? ? 選擇器{

? 樣式

? ? ? }

}

用以上的方式添加max-width? 、? min-width設(shè)置在一定范圍內(nèi)的不同樣式

書寫順序：min-width（從小到大）

max-width（從大到小）

完整的寫法? 區(qū)間? 中間用and連接

備注：連寫的兩個數(shù)值一定要有區(qū)間? 不能是空集? 不然就會值顯示? 后面那個屬性值

引入差異化? media屬性加上一個篩選條件"邏輯符? 媒體型 and （媒體特性）"

二、bootstrap

1、ui框架的作用（兼容性高）

優(yōu)點：基于框架開發(fā)，效率高，穩(wěn)定性高

2、bootstrap框架快速開發(fā)響應(yīng)式網(wǎng)頁

備注：引入后需要用相同類名

3、bootstrap3柵格系統(tǒng)布局響應(yīng)式網(wǎng)頁

柵格化是指將整個網(wǎng)頁的寬度分成若干等份

默認(rèn)把網(wǎng)頁寬度分成12等分

柵格化是指將整個網(wǎng)頁的寬度分成若干等份

*代表在12分中所占的數(shù)量多少? 比如三分之一就是4四分之一就是3? 二分之一是6 以此類推

4、細(xì)讀bootstrap網(wǎng)站使用手冊里面有大量的css格式、插件、組件等按要求使用并引入就行。