bootstrap的介紹
什麼是響應式布局
讓乙個**相容不同解析度的裝置；
給使用者更好的視覺使用體驗。
響應式布局的優缺點
優點：解決了裝置之間的差異化展示（讓不同的裝置達到最優的體驗）
缺點：對開發者來說，相容性**多，工作量大，對瀏覽器來說，載入速度受影響；
移動優先
在設計的初期就要考慮的頁面如何在多終端顯示
漸進增強
充分發揮硬體裝置的最大功能（ie678,不能用css3）
css3-media query(最簡單的方式)
借助原生js (成本高，不推薦)
第三方開源框架（可以很好的支援瀏覽器響應式布局設計）
css3-media query簡單案例
常見的屬性：
device-width，device-height —-根據螢幕的寬高來做不同的展示
width,height —-渲染視窗寬高
orientation —–裝置方向
resolution ——裝置解析度（由dpi決定）
eg：
@media screen and (min-width:480px)
}bootstrap的基本介紹（bootstrap.com）
初始化框架使用的是normalize.css；
柵格結構(grid system)（核心）
通過一系列的行（row）與列（column）的組合來建立頁面布局, 自動分為最多12列,內容在列中，而只有列可以作為行的直接子元素。
bootstrap自帶一些漂亮的css樣式，eg：**，按鈕，表單等
可以復用的布局元件，eg：導航，分頁，標籤，按鈕組等等
bootstrap中的自帶的js外掛程式，eg：輪播，摺疊，滾動監聽等等
定製bootstrap
bootstrap響應式布局
1.bootstrap布局容器 bootstrap 需要為頁面內容和柵格系統包裹乙個 container 或者.container fluid 容器，它提供了兩個作此用處的類。container container fluid 2.bootstrap柵格系統 bootstrap提供了一套響應式 移動...
bootstrap的響應式布局
可參考 進行使用 通過檢測裝置資訊，決定網頁布局方式，即使用者如果採用不同的裝置訪問同乙個網頁，有可能會看到不一樣的內容，一般情況下是檢測裝置螢幕的寬度來實現。螢幕變小了之後，屬於同一行的元素受到擠壓後，行的右邊元素自動換行顯式 螢幕大了後，本屬於同一行的元素盡可能的排在同一行內 乙個簡單的案例 d...
響應式布局之Bootstrap
1.響應式開發原理 使用 查詢針對不同寬度的裝置進行布局和樣式設定，從而達到適配不同的裝置的目的。2.響應式布局容器 響應式需要乙個父級作為布局容器，來配合子級元素來實現變化效果。原理就是在不同螢幕下，通過 查詢來改變這個布局容器的大小，再改變裡面自級元素的排列方式和大小，從而實現不同螢幕下不同的頁...