bootstrap作為支援響應式布局的乙個前端外掛程式,確實發揮著重要的作用,無論你是在手機,平板還是pc上瀏覽網頁,都能達到不錯的效果,這一切一切,都是bootstrap帶給我們的!
今天主要說下頁面的布局,這是最基礎的東西了,當我們設計乙個站點時,應該為它設計乙個全域性性的統一的規範頁面,這種頁面我們叫它布局頁,而在頁面上體現出來的東西,就是布局的元素,在bootstrap裡當然也是不可缺少的東西。
bootstrapskops的布局是一種柵格系統,即它由行和列組成,在使用時需要為頁面內容和柵格系統包裹乙個 .container 容器。
一 .container 類用於固定寬度並支援響應式布局的容器。
...
.container-fluid 類用於 100% 寬度,佔據全部視口(viewport)的容器。
...二 柵格系統的行和列,在bootstrap裡,行和列使用row和col表示,而一行中最多有12個列單元組成,col-md-1表示占用1個單元的寬度,而col-md-7表示占用7個單元的寬度,它們加在一起最多為12個單元
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-8
.col-md-4
程式設計客棧gt;
.col-md-4
.col-md-4
程式設計客棧iv class="col-md-4">.col-md-4
Bootstrap 頁面的布局
回到目錄 bootstrap作為支援響應式布局的乙個前端外掛程式,確實發揮著重要的作用,無論你是在手機,平板還是 上瀏覽網頁,都能達到不錯的效果,這一切一切,都是bootstrap帶給我們的!今天主要說下頁面的布局,這是最基礎的東西了,當我們設計乙個站點時,應該為它設計乙個全域性性的統一的規範頁面,...
Bootstrap的柵格系統 基礎布局
行必須包含在.container或.container fluid裡面,前者是固定布局,後者是100 寬度布局。行的類是.row,通過行在水平方向建立一組列。內容應該放在 列 裡,並且只有列可以作為行的直接子元素。如果一行包含的列多餘12,多餘的列所在的元素就會另起一行排列。bootstrap的柵格...
CSS頁面布局基礎
5 css頁面布局基礎 字符集不能設定寬度,如果要設定寬度必須display設定成塊級 inline 字符集 block 塊級 padding內邊距,border邊框,margin外邊距。4個 上 右 下 左,3個 上 左右 下,兩個 上下 左右,乙個 上下左右。元素浮動 float none 沒有...